在 Flutter 中自动调整任何小部件的大小

在 Flutter 中自动调整任何小部件的大小

auto_size_widget.gif

您是否遇到过希望用户调整小部件大小但不知道如何执行的场景？好吧，前段时间我也遇到过类似的情况，我决定构建一个包作为解决方案。

这[ auto_size_widget](https://pub.dev/packages/auto_size_widget) 允许用户调整任何 Flutter 小部件的大小。如果用户想要扩展字段或放大图像以获得更好的可见性等等，这对于文本字段特别有用。

以下是包的属性：

— **显示图标** ： （布尔） auto_size_widget 默认情况下有一个调整大小图标，如果您希望在小部件中没有它，请设置为 false，但是，默认情况下为 true。

— **初始宽度** ： 小部件的初始宽度，以后可以调整大小。

设置相同的值 最大宽度 保持小部件宽度不变。

— **初始高度** ： 小部件的初始高度，以后可以调整大小。

设置相同的值 最大高度 保持小部件高度不变。

— **最大宽度** ： 在调整大小期间可以达到的最大值。如果和 初始宽度 ，用户无法更改小部件的宽度。

— **最大高度** ： 在调整大小期间可以达到的最大值。如果和 初始高度 ，用户无法更改小部件的高度。

— **孩子** ： 将调整大小的小部件

— **边框颜色** ： 可选参数 设置边框颜色 自动尺寸小部件

— **盒子装饰** ： 可选参数 设置装饰 自动尺寸小部件 盒子。

您可以使用的一些常见小部件 auto_size_widget ：

1. 自动尺寸图像：

Auto Height and Width Example

此小部件可以调整子小部件（图像）的大小。在这里，我为 最大宽度 和 最大高度 .和不同的相等值 初始宽度 和 初始高度 .

这会调整小部件的高度和宽度。

2. Auto Size TextField（恒定高度）：

Auto Width Example

在这里，一个 TextField 用 自动尺寸小部件 ， 这 文本域 宽度可以从值 180 调整到 300。但是高度保持不变并且在调整大小期间不会改变。

3.自动大小文本（恒定宽度）：

Auto Height Example

在这里， 文本 小部件被包裹着 自动尺寸小部件 .这 文本 小部件高度可以从 120 调整到 280。 宽度 这里保持不变，在调整大小期间不会改变。

这 自动尺寸小部件 附带一个 盒子装饰 默认情况下，当用户调整小部件大小时，它充当指南。

您可以通过传递您自己的值来跳过该框 盒子装饰 参数，或通过设置 边框颜色 作为 颜色.透明 .但是，建议保留默认值，因为它是有目的的。

这是盒子被移除后小部件的外观以及当 显示图标 是 真的 ：

你可以包装 自动尺寸小部件 围绕任何以后可以由用户调整大小的 Flutter 小部件。这个包会很有帮助，尤其是在您构建 Web 应用程序时。

目前为止就这样了。如果您觉得有帮助，请随时在评论中留下任何建议并分享！

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/37524/10161810