微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

我如何将最小高度设置为我的容器并在按钮上单击colick后然后wrapcontent高度等于文本高度

如何解决我如何将最小高度设置为我的容器并在按钮上单击colick后然后wrapcontent高度等于文本高度

我想在动画中向容器显示更多带有设置动画的文本。我想为容器设置最小高度,然后设置动画以扩展容器。 喜欢这张图片 https://raw.githubusercontent.com/Blogcat/Android-ExpandableTextView/master/demo.gif

解决方法

您可以在下面复制粘贴运行完整代码
您可以将AnimatedContainerText overflow: TextOverflow.fade一起使用
代码段

ShowMore(
          content: '...',desiredMaxHeight: 200.0,desiredMinHeight: 56.0,),...
AnimatedContainer(
          duration: const Duration(milliseconds: 700),width: double.infinity,height: showStatus == ShowStatus.EXPANDED
              ? widget.desiredMaxHeight
              : widget.desiredMinHeight,child: Text(
            widget.content,softWrap: true,overflow: TextOverflow.fade,)),

工作演示

enter image description here

完整代码

import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';

class ShowMore extends StatefulWidget {
  /// The string which will be used by Text widget
  final String content;

  /// The height in pixels of the largest possible size an AnimatedContainer will be
  final double desiredMaxHeight;

  /// The height in pixels of the smallest possible size an AnimatedContainer will be
  final double desiredMinHeight;

  const ShowMore(
      {Key key,@required this.content,@required this.desiredMaxHeight,@required this.desiredMinHeight})
      : assert(content != null),assert(desiredMaxHeight != null),assert(desiredMinHeight != null),super(key: key);

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

class ShowMoreState extends State<ShowMore> {
  _ontap update;
  ShowStatus showStatus;

  void _update() {
    setState(() {
      showStatus = showStatus == ShowStatus.EXPANDED
          ? ShowStatus.UNEXPANDED
          : ShowStatus.EXPANDED;
    });
  }

  @override
  void initState() {
    super.initState();
    showStatus = ShowStatus.UNEXPANDED;
    update = _update;
  }

  @override
  Widget build(BuildContext context) {
    return Column(children: <Widget>[
      AnimatedContainer(
          duration: const Duration(milliseconds: 700),Container(
          width: double.infinity,height: 56.0,child: Row(
              mainAxisAlignment: MainAxisAlignment.start,children: <Widget>[
                showStatus == ShowStatus.EXPANDED
                    ? RaisedButton(
                        onPressed: () {
                          update();
                        },child: Text("COLLAPSE"))
                    : RaisedButton(
                        onPressed: () {
                          update();
                        },child: Text("EXPAND")),])),]);
  }
}

/// Function that is called when updating a widget
typedef void _ontap();

enum ShowStatus {
  UNEXPANDED,EXPANDED,}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        primarySwatch: Colors.blue,visualDensity: VisualDensity.adaptivePlatformDensity,home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,children: <Widget>[
            ShowMore(
              content:
                  'Lorem ipsum dolor sit amet,prima liberavisse cu mei,his elit fabulas ex. Ne justo dicunt referrentur eam. Eum nulla eleifend id,ex vim ferri vitae pericula,qui epicurei interpretaris te. His ei debitis habemus intellegebat,essent assentior incorrupte ne has. Has te inani option,qui eu etiam feugiat epicurei,posidonium dissentias at nam. Ne his malis probatus consequat. Purto neglegentur vim ea,et vim reque quaestio corrumpit,perfecto singulis no his. Homero minimum efficiendi vix no. Vel an adhuc debet constituam,dicant consul percipitur nam ut,pri vide dicam feugait ei. Lorem homero graeci ex nam,labitur virtute mnesarchum in mel.',],floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,tooltip: 'Increment',child: Icon(Icons.add),);
  }
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。