flutter 如何在RawChip中 Package 文本?

xqk2d5yq  于 2023-06-07  发布在  Flutter
关注(0)|答案(1)|浏览(135)

现在我把自己逼到了墙角...
在Flutter中,我有以下代码片段:

SingleChildScrollView(
   child: Column(
     crossAxisAlignment: CrossAxisAlignment.start,
     children: [
       StreamBuilder(
         stream: globals.mWorkDatabase.getPictureFiles().watch(),
         builder: (context, snapshot) {
           if(snapshot.hasError){
             return Card(
               color: Colors.red,
               child: Padding(
                 padding: const EdgeInsets.all(4.0),
                 child: Text(
                   snapshot.error.toString(),
                   style: const TextStyle(color: Colors.yellow),),
               ),
             );
           }
           if(snapshot.connectionState==ConnectionState.waiting){
             return const CircularProgressIndicator();
           }
           if(snapshot.hasData){
             var pictureFiles = snapshot.data as List<PictureFile?>?;
             if(pictureFiles?.isNotEmpty==true){
               return ListView.builder(
                   physics: const NeverScrollableScrollPhysics(),
                   shrinkWrap: true,
                   reverse: true,
                   controller: ScrollController(),
                   itemCount: pictureFiles?.length,
                   itemBuilder: (context, index){
                     return Row(
                       mainAxisAlignment: MainAxisAlignment.start,
                       mainAxisSize: MainAxisSize.min,
                       children: [
                         Theme(
                           data: Theme.of(context).copyWith(canvasColor: Colors.transparent),
                           child: RawChip( //<-- I want the text to wrap in RawChip !
                             backgroundColor: const Color(0x77FFFFFF),
                             label: Text("${pictureFiles?[index]?.filePath}"),
                             avatar: const Icon(Icons.image_outlined),
                             onDeleted: (){
                             },
                             onPressed: (){
                             },
                           ),
                         ),
                       ],
                     );
                   }
               );
             }
           }
           return const Card(
             child: Padding(
               padding: EdgeInsets.all(4.0),
               child: Text("No pictures available..."),
             ),
           );
         }
       ),
     ],
   ),
 ),

麻烦的是,芯片中的文本溢出,我需要显示芯片内的整个文本。有没有可能让芯片内的文字 Package ?

c3frrgcw

c3frrgcw1#

看起来你只需要把Theme Package 在Expanded里面。
示例:

import 'package:flutter/material.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: [
            Expanded(           <--- Here wrap with Expanded
              child: Theme(
                data:
                    Theme.of(context).copyWith(canvasColor: Colors.transparent),
                child: RawChip(
                  backgroundColor: const Color(0x77FFFFFF),
                  label: Text("yasd asdh ad ajsd ajhds a sd" * 2),
                  avatar: const Icon(Icons.image_outlined),
                  onDeleted: () {},
                  onPressed: () {},
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

输出:

相关问题