pdl 的个人博客

记录精彩的程序人生

Open Source, Open Mind,
Open Sight, Open Future!
  menu
121 文章
4453 浏览
0 当前访客
ღゝ◡╹)ノ❤️

flutter使用笔记

MaterialApp配置主题

ThemeData({
  Brightness brightness, //深色还是浅色
  MaterialColor primarySwatch, //主题颜色样本,见下面介绍
  Color primaryColor, //主色,决定导航栏颜色
  Color accentColor, //次级色,决定大多数Widget的颜色,如进度条、开关等。
  Color cardColor, //卡片颜色
  Color dividerColor, //分割线颜色
  ButtonThemeData buttonTheme, //按钮主题
  Color cursorColor, //输入框光标颜色
  Color dialogBackgroundColor,//对话框背景颜色
  String fontFamily, //文字字体
  TextTheme textTheme,// 字体主题,包括标题、body等文字样式
  IconThemeData iconTheme, // Icon的默认样式
  TargetPlatform platform, //指定平台,应用特定平台控件风格
  ...
})
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'qshdapp',
      theme: ThemeData(
        primaryColor: Colors.white,
      ),
      home:
          IndexPage().buildPage(null), //MyHomePage(title: 'qshdapp Home Page'),
    );
  }
}

设置沉浸式状态栏

import 'dart:io';
import 'package:flutter/services.dart';

void main() {
  runApp(MyApp());
  if (Platform.isAndroid) {
    // 以下两行 设置android状态栏为透明的沉浸。写在组件渲染之后,是为了在渲染后进行set赋值,覆盖状态栏,写在渲染之前MaterialApp组件会覆盖掉这个值。
    SystemUiOverlayStyle systemUiOverlayStyle = SystemUiOverlayStyle(
      systemNavigationBarColor: const Color(0x00000000),
      systemNavigationBarDividerColor: null,
      statusBarColor: const Color(0x00000000),
      systemNavigationBarIconBrightness: Brightness.dark,
      statusBarIconBrightness: Brightness.dark,
      statusBarBrightness: Brightness.dark,
    );
    SystemChrome.setSystemUIOverlayStyle(systemUiOverlayStyle);
  }
}

相对屏幕居中定位

  1. StackAlign Widget实现绝对定位, alignment: FractionalOffset(0.5, 0.95)
  2. StackContainer Widget实现绝对定位, alignment: FractionalOffset(0.5, 0.95)
  3. StackPositioned Widget实现绝对定位, bottom: 40.0, 记得在Stack里面写alignment: Alignment.center

例子:

        child: Stack(
          alignment: Alignment.center, // 元素没定位的x/y坐标统一定位这里
          children: <Widget>[
            Container(
              child: viewService.buildComponent("amap"),
            ),
            Container(
              alignment: FractionalOffset(0.5, 0.95),
              child: Text("111111111111111111111111111111"),
            ),
            Positioned(
              left: 640.0,
              child: Text("风刀霜剑龙卷风可视对讲焚枯食淡"),
            ),
            Positioned(
              bottom: 40.0,
              child: Center(
                child: FloatingActionButton(
                  onPressed: () {
                    dispatch(IndexActionCreator.onAction(1));
                  },
                  child: Column(
                    children: <Widget>[
                      Container(
                        height: 5.0,
                      ),
                      Icon(Icons.crop_free),
                      Text("扫码"),
                    ],
                  ),
                ),
              ),
            ),
          ],
        ),

标题:flutter使用笔记
作者:pengdongliang
地址:https://www.p0d0.com/articles/2019/07/19/1573740594425.html