团队作业博客（三）flutter 尝试创建第一个页面（三）

新建目录 assets  存放图片

在pubspec..yaml 中添加

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
  assets:
      - assets/阿尼亚.jpg
      - assets/可可爱爱阿尼亚.jpg

在 目录 lib  main.dart文件中添加以下代码

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // 每个项目最外层，必须有MaterialApp
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '心语航标',
      theme: ThemeData(

        primarySwatch: Colors.purple,
      ),
      // 通过Home 指定首页
      home: MyHome(),
    );
  }
}

class MyHome extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // 在flutter 中 ，每个控件都是一个类
    return Scaffold(
      appBar: AppBar(
        title: Text("心语航标"),
        centerTitle: true,
        //右侧行为按钮
        actions:<Widget>[
          IconButton(
            icon: Icon(Icons.search),
            onPressed: () {},
          )
        ],
      ),

      drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.all(0),
          children:const <Widget>[
            UserAccountsDrawerHeader(
              accountEmail: Text('newemail@aniya.com'),
              accountName: Text('阿尼亚'),
              currentAccountPicture: CircleAvatar(
                backgroundImage:AssetImage('assets/阿尼亚.jpg') ,),
              //美化当前控件的
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('assets/可可爱爱阿尼亚.jpg'),
                    fit: BoxFit.cover, // 可选的，根据需要设置图片的适应方式
                  ),
                )
            ),
            ListTile(title:Text('用户反馈'),trailing: Icon(Icons.feedback),),
            ListTile(title:Text('系统设置'),trailing: Icon(Icons.settings),),
            ListTile(title:Text('我要发布'),trailing: Icon(Icons.send),),
            ListTile(title:Text('注销'),trailing: Icon(Icons.exit_to_app),)
          ],
        ),
      ),

      
    );
  }
}

显示效果