diff --git a/assets/images/muyu.png b/assets/images/muyu.png new file mode 100644 index 0000000..a5a35ea Binary files /dev/null and b/assets/images/muyu.png differ diff --git a/lib/main.dart b/lib/main.dart index 81a9dac..fd2fc6b 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -2,6 +2,7 @@ import 'package:flutter/material.dart'; import 'counter/counter_page.dart'; import 'guess/guess_page.dart'; +import 'muyu/muyu_page.dart'; void main() { runApp(const MyApp()); @@ -18,7 +19,7 @@ class MyApp extends StatelessWidget { theme: ThemeData( primarySwatch: Colors.blue, ), - home: const GuessPage(title: '猜数字'), + home: const MuyuPage(), ); } } diff --git a/lib/muyu/muyu_page.dart b/lib/muyu/muyu_page.dart new file mode 100644 index 0000000..0fffb2b --- /dev/null +++ b/lib/muyu/muyu_page.dart @@ -0,0 +1,88 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; + +class MuyuPage extends StatefulWidget { + const MuyuPage({Key? key}) : super(key: key); + + @override + State createState() => _MuyuPageState(); +} + +class _MuyuPageState extends State { + @override + Widget build(BuildContext context) { + return Scaffold( + appBar: AppBar( + elevation: 0, + systemOverlayStyle: const SystemUiOverlayStyle( + statusBarIconBrightness: Brightness.dark, + statusBarColor: Colors.transparent), + backgroundColor: Colors.white, + titleTextStyle: const TextStyle(color: Colors.black), + iconTheme: const IconThemeData(color: Colors.black), + title: const Text("电子木鱼"), + actions: [ + IconButton(onPressed: _toHistory, icon: const Icon(Icons.history)) + ], + ), + body: Column( + children: [ + Expanded(child: _buildTopContent()), + Expanded(child: _buildImage()), + ], + ), + ); + } + + void _toHistory() {} + + Widget _buildTopContent() { + final ButtonStyle style = ElevatedButton.styleFrom( + minimumSize: const Size(36, 36), + padding: EdgeInsets.zero, + backgroundColor: Colors.green, + elevation: 0, + ); + + return Stack( + children: [ + Center( + child: Text( + '功德数: 0', + style: TextStyle( + fontSize: 24, + fontWeight: FontWeight.bold, + ), + ), + ), + Positioned( + right: 10, + top: 10, + child: Wrap( + spacing: 8, + direction: Axis.vertical, + children: [ + ElevatedButton( + style: style, + onPressed: () {}, + child: Icon(Icons.music_note_outlined), + ), + ElevatedButton( + style: style, + onPressed: () {}, + child: Icon(Icons.image), + ) + ], + )), + ], + ); + } + + Widget _buildImage() { + return Center( + child: Image.asset( + 'assets/images/muyu.png', + height: 200, + )); + } +} diff --git a/pubspec.lock b/pubspec.lock index a82b08f..ab423fe 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -185,4 +185,4 @@ packages: source: hosted version: "2.1.4" sdks: - dart: ">=2.19.0 <4.0.0" + dart: ">=2.19.0 <3.0.0" diff --git a/pubspec.yaml b/pubspec.yaml index bac2777..4afd5a0 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -52,39 +52,35 @@ dev_dependencies: # The following section is specific to Flutter packages. flutter: - - # The following line ensures that the Material Icons font is - # included with your application, so that you can use the icons in - # the material Icons class. uses-material-design: true - # To add assets to your application, add an assets section, like this: - # assets: - # - images/a_dot_burr.jpeg - # - images/a_dot_ham.jpeg + assets: + - assets/images/ + + + + + + + + + + + + + + + + + + + + + + + + + - # An image asset can refer to one or more resolution-specific "variants", see - # https://flutter.dev/assets-and-images/#resolution-aware - # For details regarding adding assets from package dependencies, see - # https://flutter.dev/assets-and-images/#from-packages - # To add custom fonts to your application, add a fonts section here, - # in this "flutter" section. Each entry in this list should have a - # "family" key with the font family name, and a "fonts" key with a - # list giving the asset and other descriptors for the font. For - # example: - # fonts: - # - family: Schyler - # fonts: - # - asset: fonts/Schyler-Regular.ttf - # - asset: fonts/Schyler-Italic.ttf - # style: italic - # - family: Trajan Pro - # fonts: - # - asset: fonts/TrajanPro.ttf - # - asset: fonts/TrajanPro_Bold.ttf - # weight: 700 - # - # For details regarding fonts from package dependencies, - # see https://flutter.dev/custom-fonts/#from-packages