129 lines
3.2 KiB
Dart
129 lines
3.2 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
class CompositionPage extends StatefulWidget {
|
|
const CompositionPage({super.key});
|
|
|
|
@override
|
|
_CompositionPageState createState() => _CompositionPageState();
|
|
}
|
|
|
|
class _CompositionPageState extends State<CompositionPage> {
|
|
String dialedNumber = "";
|
|
|
|
|
|
void _onNumberPress(String number) {
|
|
setState(() {
|
|
dialedNumber += number;
|
|
});
|
|
}
|
|
|
|
|
|
void _onDeletePress() {
|
|
setState(() {
|
|
if (dialedNumber.isNotEmpty) {
|
|
dialedNumber = dialedNumber.substring(0, dialedNumber.length - 1);
|
|
}
|
|
});
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: Colors.black,
|
|
body: Column(
|
|
children: [
|
|
Expanded(
|
|
flex: 1,
|
|
child: Center(
|
|
child: Text(
|
|
dialedNumber,
|
|
style: const TextStyle(
|
|
fontSize: 32,
|
|
color: Colors.white,
|
|
letterSpacing: 2.0,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Expanded(
|
|
flex: 3,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(16.0),
|
|
child: GridView.builder(
|
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 3,
|
|
mainAxisSpacing: 10,
|
|
crossAxisSpacing: 10,
|
|
childAspectRatio: 1,
|
|
),
|
|
itemCount: 12,
|
|
itemBuilder: (context, index) {
|
|
if (index < 9) {
|
|
|
|
return _buildDialButton((index + 1).toString());
|
|
} else if (index == 9) {
|
|
|
|
return const SizedBox.shrink();
|
|
} else if (index == 10) {
|
|
|
|
return _buildDialButton('0');
|
|
} else {
|
|
|
|
return _buildDeleteButton();
|
|
}
|
|
},
|
|
),
|
|
),
|
|
),
|
|
Padding(
|
|
padding: const EdgeInsets.only(bottom: 20.0),
|
|
child: FloatingActionButton(
|
|
backgroundColor: Colors.green,
|
|
onPressed: () {
|
|
|
|
},
|
|
child: const Icon(Icons.phone, color: Colors.white),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
|
|
Widget _buildDialButton(String number) {
|
|
return ElevatedButton(
|
|
onPressed: () => _onNumberPress(number),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.black,
|
|
shape: const CircleBorder(),
|
|
padding: const EdgeInsets.all(20),
|
|
),
|
|
child: Text(
|
|
number,
|
|
style: const TextStyle(
|
|
fontSize: 24,
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
|
|
Widget _buildDeleteButton() {
|
|
return ElevatedButton(
|
|
onPressed: _onDeletePress,
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.black,
|
|
shape: const CircleBorder(),
|
|
padding: const EdgeInsets.all(20),
|
|
),
|
|
child: const Icon(
|
|
Icons.backspace,
|
|
color: Colors.white,
|
|
size: 24,
|
|
),
|
|
);
|
|
}
|
|
}
|