I have been learning Flutter for some time. I have sorted out my previous study notes as a record. I am still studying and improving Flutter.

This article is some of the basic knowledge of entry, learning record stick, Daniel do not spray, manual beg for mercy 😆. In the Demo, you can see Routes, Localizations, Provider 1.Text, 2.Status, 3.Button, 4.Image, 5.TextField, 6.Stack/Row, 7.ListView, 8.GridView, 9.CustomScrollView 10.NestedScrollView, 11.Dialog, 12.Drawer, 13.Animation, 14.Transition, 15.Date, 16.Dio, 17.ScreenFit, 18.

Rich text interaction

RichText(text: TextSpan(style: defaulttextstyle.of (context). Style, children: [TextSpan(text: "login is treated as consent ", style: Recognizer: recognizer (fontSize: 20), recognizer (Text: "Service Agreement ", Style: TextStyle(fontSize: 20, color: colors.red), recognizer: recognizer: TapGestureRecognizer() // Attribute specifies gesture interaction..onTap = () {print("Hello World7");}),],),);Copy the code

Custom input box

Container( height: 60, width: 250, child: TextField( decoration: InputDecoration( fillColor: Color(0x30cccccc), filled: true, enabledBorder: OutlineInputBorder( borderSide: BorderSide(color: Color(0x00FF0000)), borderRadius: Borderradius.all (radius.circular (100)),), hintText: "Please enter email/phone number ", focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Color(0x00FF0000)), borderRadius: BorderRadius.all(Radius.circular(100)), ), ), textAlign: Textalign.center, // center),);Copy the code

IOS style pop-ups

class CustomDialog extends StatelessWidget {
  final String title;
  final String content;
  final VoidCallback onSubmit;

  CustomDialog({this.title = "", this.content = "", this.onSubmit});

  @override
  Widget build(BuildContext context) {
    return Dialog(
      backgroundColor: Colors.white,
      elevation: 5,
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.circular(10))),
      child: Container(
        width: 50,
        child: _buildDialog(context),
      ),
    );
  }

  Widget _buildDialog(context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        _buildBar(context),
        _buildTitle(),
        _buildContent(),
        _buildFooter(context),
      ],
    );
  }
Copy the code

NestedScrollView can nest the scroll views of other scroll views within it

Widget _buildNestedScrollView2() { return SafeArea( child: NestedScrollView( headerSliverBuilder: (context, innerBoxIsScrolled) {return [SliverAppBar(expandedHeight: 230.0, pinned: false, flexibleSpace: Padding( padding: EdgeInsets.symmetric(vertical: 0), child: PageView( children: [ Container( child: Image.asset("assets/images/liu.jpeg", fit: BoxFit.cover), ), Container( child: Image.asset("assets/images/liu.jpeg", fit: BoxFit.cover), ), ], ), ), ), SliverPersistentHeader( pinned: true, delegate: StickyTabBarDelegate( child: TabBar( controller: _tabbarController, labelColor: Colors.black, tabs: <Widget>[ Tab(text: tabs[0]), Tab(text: tabs[1]), ], ), ), ), ]; }, body: TabBarView( controller: _tabbarController, children: [ HomeListView2(title: tabs[0]), HomeListView2(title: tabs[1]), ], ), ), ); }Copy the code

Combination of animation

AnimatedBuilder( animation: _sizeAnimation, builder: (context, child) { return Opacity( opacity: _opacityanim. value, // transparency child: Transform(Transform: matrix4.rotationz (_rotationim.value), // Alignment. Center, child: Container(width: _sizeAnimation.value, // Size size height: _sizeanimation. value, color: _coloranimation. value, // color),),); });Copy the code

I’m not perfect. But I keep trying. Project address: flutter_learn