1

ListView にいくつかの異なるサイズの画像を表示する必要があります。

画像が screen.width よりも大きい場合は、幅に合わせて縮小したいと思います。しかし、画像が短い場合は、元のサイズを維持したいと思います。

どうすればいいですか？前もって感謝します。

Image を Flex の中に入れようとしましたが、小さなものを拡大するのを「止める」ことができませんでした。

import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:firebase_database/firebase_database.dart';

void main() => runApp(MyApp());

const _imagesDir = "images";

class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Image List',
        theme: ThemeData(primarySwatch: Colors.blue,),
        home: MyListPage(title: 'Image List Page'),
    );
}
}

class MyListPage extends StatefulWidget {
MyListPage({Key key, this.title}) : super(key: key);

final String title;

@override
_MyListPageState createState() => _MyListPageState();
}

class _MyListPageState extends State<MyListPage> {

Widget build1(BuildContext context, AsyncSnapshot snapshot) {

    Widget _tileImagem(BuildContext context, String imageName) {
            imageName = _imagesDir + "/"+ imageName;
            return Padding(padding:EdgeInsets.all(2.0), 
                child: Flex(
                    direction: Axis.vertical,
                    children: <Widget>[
                        Image.asset(imageName),
                    ]
                ),
            );

    }

    return Scaffold(
        appBar: PreferredSize(
            preferredSize: Size.fromHeight(40.0),
            child: AppBar(
                title: Row(
                    children: <Widget> [
                        Padding(padding: EdgeInsets.only(right: 20.0),),
                        Text( 'Duda'), 
                    ]),
            )
        ),
        body: ListView(
            shrinkWrap: true,
            children: <Widget>[
                Container(),
                _tileImagem(context, 'flutter_big_medium.png'),
                Container(), //My App have some different widgets 
                Container(),
                Container(), //I kept them here just as place holder
                Container(),
                Container(),
                Container(),
                Container(),
                Container(),
                Divider(),
                TileTexts(),
                Divider(),
            ],
        ),
        floatingActionButton: FloatingActionButton(
            onPressed: () { },
            child: Icon(Icons.skip_next),
        ),
    ); 
}

@override
Widget build(BuildContext context) {
    return new FutureBuilder(
        future: 
            FirebaseDatabase.instance.reference()
                .child('Testing')
                .once(),
        builder: (BuildContext context, AsyncSnapshot snapshot) {
            switch (snapshot.connectionState){
                case ConnectionState.done: return build1(context, snapshot);
                case ConnectionState.waiting: return CircularProgressIndicator();
                default:
                    if (snapshot.hasError) {
                        return Text("hasError: ${snapshot.error}");
                    } else {
                        return Text("${snapshot.data}");
                    }
            }                                
        }
    );
}
}

class TileTexts extends StatefulWidget {

TileTexts() : super();

@override
_TileTextsState createState() => _TileTextsState();
}

class _TileTextsState extends State<TileTexts> {

@override
void initState() {
    super.initState();
}

    Widget text1(String title, String imageName, TextStyle style) {
        return Expanded(
            child:Container(
                margin: const EdgeInsets.only(left: 10.0),
                child: Column(
                    children: <Widget>[
                        Html(data: title, 
                            useRichText: true,
                            defaultTextStyle: style,
                        ),
                        ((imageName == null))
                            ? Container()
                            : Image.asset(_imagesDir + "/"+imageName),
                    ]
                ),
            ),
        );
    }

    Widget _tileDetail(BuildContext context, String imageName) {
        return Container(
            padding: EdgeInsets.fromLTRB(5.0,0.0,10.0,0.0),
            child: Row(
                children: <Widget>[ 
                    Material(
                        shape: RoundedRectangleBorder(borderRadius:BorderRadius.circular(22.0) ),
                        clipBehavior: Clip.antiAlias,
                        child: MaterialButton(
                            child: Text('X'),
                            color: Theme.of(context).accentColor,
                            elevation: 8.0,
                            height: 36.0,
                            minWidth: 36.0,
                            onPressed: () {
                                //
                            },
                        ),
                    ),
                    text1('<body>veja a imagem</body>', imageName, Theme.of(context).textTheme.caption),
                ],
            ),
        );
    }

//_TileTexts
@override
Widget build(BuildContext context) {
    print('_TileTexts build');
    return Column(
        children: <Widget>[
            _tileDetail(context, 'flutter_med_medium.png'),
            Divider(),
            _tileDetail(context, 'flutter_med_medium.png'),
            Divider(),
            _tileDetail(context, 'flutter_med_medium.png'),
        ],
    );
}
}
4

2 に答える 2

0

ドキュメントを確認してください。

先頭および末尾のウィジェットの高さは、マテリアル スペックに従って制限されます。アクセシビリティのために、1 行の ListTiles は例外です。以下の例を参照して、マテリアル仕様とアクセシビリティ要件の両方を順守する方法を確認してください。

ドキュメントを読んだ後、あなたが望むものを達成する必要があります:)

于 2020-03-29T05:07:15.990 に答える