flutter - 不一致的分隔线颜色

Question

我遇到了分隔线颜色与预期不符的问题。所以我有 2 个分隔线。它们都是 Colors.white:

const white = Colors.white;
const transparent = Colors.transparent;

正在发生的事情的图像:

如您所见，有 2 个分隔线，但颜色非常不一致。我不知道为什么会这样，因为代码几乎相同。一开始以为是背景，注释掉后发现只是一个平面页面，颜色还是不一样。有谁知道为什么会这样？

这是我的代码:

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     backgroundColor: blue,
     body: 
     SingleChildScrollView(
       child: Center(
         child:Stack(
           children: <Widget>[
            Align(
             // omitted code
            ), 
            Align(
            // omitted code
            ),
            Align(
              alignment:Alignment.center,
              child:  Container(       
                height: MediaQuery.of(context).size.height,
                width: MediaQuery.of(context).size.width/1.2,
                child:   Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    Expanded(flex:2,child: SizedBox(),),
                    StreamBuilder<QuerySnapshot>(
                    // omitted code
                    ),
                    Expanded(child: SizedBox(),),
                    Expanded(
                      flex: 15,
                      child:Container(
                        child:StreamBuilder<DocumentSnapshot>(
                          stream: Firestore.instance
                            .collection("Users")
                            .document(widget.userEmail)
                            .collection("Flight Data")
                            .document("Courses")
                            .collection(widget.courseAbbr)
                            .document(_dateSelected).snapshots(),
                          builder: (context, snapshot){
                            if (snapshot.hasError) {
                              return new Text('${snapshot.error}');
                            } else if (!snapshot.hasData) {
                              return Center(child: CircularProgressIndicator(valueColor: AlwaysStoppedAnimation<Color>(white),));
                            } else {  
                              switch (snapshot.connectionState) {
                                case ConnectionState.waiting:
                                  return Center(child: CircularProgressIndicator(valueColor: AlwaysStoppedAnimation<Color>(white),)); 
                                default:
                                  var doc = snapshot.data;
                                  return Column(
                                    children: <Widget>[
                                      Expanded(
                                        flex: 7,
                                        child: Container(
                                          decoration: BoxDecoration(
                                            color: blackTrans,
                                            borderRadius: BorderRadius.all(Radius.circular(5.0)),
                                            ),
                                          child: ListView.builder(
                                            scrollDirection: Axis.vertical,
                                            shrinkWrap: true,
                                            itemCount: _dateSelected == null ? 1 : doc["patterns"].length + 1,
                                            itemBuilder: (BuildContext context, int index) {
                                              if (index == 0 ) {
                                                return Column(
                                                  children: <Widget>[
                                                    AutoSizeText(NA_FLIGHT_PAGE_PATTERN, style: TextStyle(color: white),minFontSize: 16.0,), 
                                                    Divider(color: transparent,),
                                                    Divider(color: white,) // 1st DIVIDER
                                                  ],
                                                ); 
                                              }
                                              index -= 1;
                                              var patterns = doc["patterns"];
                                              return buildPatternTile(patterns[index]);                
                                            }
                                          ),
                                        ),
                                      ),
                                      Expanded(flex: 1,child: SizedBox(),),
                                      Expanded(
                                        flex: 4,
                                        child: Container(
                                          decoration: BoxDecoration(
                                            color: blackTrans,
                                            borderRadius: BorderRadius.all(Radius.circular(5.0)),
                                            ),
                                            child: Column(
                                              children: <Widget>[
                                                Divider(color: transparent,),
                                                Divider(color: transparent,),
                                                AutoSizeText(
                                                  _dateSelected == null ? NA_FLIGHT_PAGE_REMARKS2 : doc["instructor"] + NA_FLIGHT_PAGE_REMARKS, 
                                                  style: TextStyle(color: white),minFontSize: 16.0,),
                                                Divider(color: transparent,), 
                                                Divider(color: white,), // 2nd DIVIDER
                                                Divider(color: transparent,),
                                                AutoSizeText(
                                                  _dateSelected == null ? "" : doc["remarks"], 
                                                  style: TextStyle(color: white),minFontSize: 16.0,), 
                                              ],
                                            ),                                          
                                        ),
                                      ),
                                      Expanded(flex: 1,child: SizedBox(),),
                                      Expanded(
                                        flex: 2,
                                        child: Container(
                                          decoration: BoxDecoration(
                                            color: blackTrans,
                                            borderRadius: BorderRadius.all(Radius.circular(5.0)),
                                            ),                                          
                                        ),
                                      ),                                      
                                    ],
                                  );
                              }                 
                            } 
                          },
                        ),
                      ),
                    ),
                    Expanded(child: SizedBox(),),                             
                  ],
                ),
              ),
            ),
           ],
         )
        )
     )
   );
 }

Answer 1

我可以为您提供替代解决方案。这肯定会完成你的工作，你不会发现你的分隔线颜色有任何不一致。让我知道你是怎么想的。

想法:

Container() would be there

• Height would be specified
• Decorationbox would used, in which bottomborder is used, color would be given
• In child you pass the child, under which you want the border

给你一个工作示例，你根据你的小部件实现它:

Container(
  height: 44.0,
  //this does the work for divider
  decoration: BoxDecoration(
    border: Border(bottom: BorderSide(color: Colors.white, width: 1.0))
  ),
  child: Your_Child_Widget_Here
)

谢谢。编码愉快!