Flutter 中如何添加垂直分隔线【Flutter 专题 18】

import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
/// This is the main application widget.class MyApp extends StatelessWidget {  const MyApp({Key? key}) : super(key: key);
  static const String _title = 'Flutter VerticalDivider Sample';
  @override  Widget build(BuildContext context) {    return MaterialApp(      title: _title,      home: Scaffold(        appBar: AppBar(title: const Text(_title)),        body: const MyStatelessWidget(),      ),    );  }}
/// This is the stateless widget that the main application instantiates.class MyStatelessWidget extends StatelessWidget {  const MyStatelessWidget({Key? key}) : super(key: key);
  @override  Widget build(BuildContext context) {    return Container(      padding: const EdgeInsets.all(10),      child: Row(        children: <Widget>[          Expanded(            child: Container(              alignment: Alignment.center,              decoration: BoxDecoration(                borderRadius: BorderRadius.circular(10),                color: Colors.blue,              ),              child: Text(                "坚果",                style: TextStyle(fontSize: 23),              ),            ),          ),          const VerticalDivider(            color: Colors.grey,            thickness: 1,            indent: 20,            endIndent: 0,            width: 20,          ),          Expanded(            child: Container(              alignment: Alignment.center,              decoration: BoxDecoration(                borderRadius: BorderRadius.circular(10),                color: Colors.orange,              ),              child: Text(                "前端",                style: TextStyle(fontSize: 23),              ),            ),          ),        ],      ),    );  }}

VerticalDivider({  Key? key,  this.width,  this.thickness,  this.indent,  this.endIndent,  this.color,}) 

color : 设置分隔线颜色thickness: 设置分隔线的厚度indent : 设置分隔符顶部的空间endIndent :设置分隔线底部的空间

IntrinsicHeight(  child: Row(    mainAxisAlignment: MainAxisAlignment.spaceEvenly,    crossAxisAlignment: CrossAxisAlignment.center,    children: [    Icon(Icons.menu,color: AppColors.technoBlack,),    SizedBox(width: 5.w,),    Expanded(child: TextField(    style: TextStyle(fontSize: 16.sp,color: AppColors.technoBlack,fontWeight: FontWeight.w300),      decoration: InputDecoration(      hintText: "Your Current Location",      focusedBorder: InputBorder.none,

    ),)),      SizedBox(width: 5.w,),
    VerticalDivider(color: AppColors.technoBlack,thickness: 2),      SizedBox(width: 5.w,),    Icon(Icons.filter_tilt_shift,color: AppColors.technoBlack,),  ],),),

Row(    mainAxisAlignment: MainAxisAlignment.spaceEvenly,  crossAxisAlignment: CrossAxisAlignment.center,  children: [  Icon(Icons.menu,color: AppColors.technoBlack,),  SizedBox(width: 5.w,),  Expanded(child: TextField(  style: TextStyle(fontSize: 16.sp,color: AppColors.technoBlack,fontWeight: FontWeight.w300),    decoration: InputDecoration(    hintText: "Your Current Location",    focusedBorder: InputBorder.none,

  ),)),    SizedBox(width: 5.w,),
  SizedBox(child: VerticalDivider(color: AppColors.technoBlack,thickness: 2,),height: 30,),    SizedBox(width: 5.w,),  Icon(Icons.filter_tilt_shift,color: AppColors.technoBlack,),],),