1.AspectRatio
The role of AspectRatio is to adjust the aspect ratio of the child element child according to the setting
AspectRatio will first expand as much as possible within the scope allowed by the layout constraints. The height of the widget is determined by the width and ratio, similar to the contain in BoxFit, and try to occupy the area as much as possible according to the fixed ratio. If a feasible size cannot be found after satisfying all constraints,
AspectRatio will eventually give priority to adapting to layout constraints, regardless of the ratio set.
2.Card
Card is a card component block, and its content can be composed of most types of Widgets. Card has rounded corners and shadows, which make it look three-dimensional.
Attributes:
CircleAvatar implements a circular image:
Basically, a CircleAvatar doesn't provide properties to set a border, however, it can be wrapped in a different CircleAvatar with a larger radius and a different background color to create something similar to a border.
3. Button component
Attributes:
parameter:
Modify the width and height of the button: Add SideBox or Container to the outer layer to modify the width or height
Modify the background color: backgroundcolor:Materialstateproperty.a11(Colors .blue)
Modify the font color: foregroundColor: Materia1stateproperty.a11(Colors .white)
Adaptive button outer layer plus Expanded component
Rounded buttons:
shape: MaterialstateProperty.all( RoundedRectangleBorder( borderRadius: BorderRadius.circular(20))), can also be implemented with the Container component
4. Wrap component
Application scenario: search page
Wrap can realize flow layout, the performance of single-row Wrap is almost the same as that of Row, and the performance of single-column Wrap is almost the same as that of Column. But Row and Column are both single-row and single-column, and Wrap breaks through this limitation. When there is insufficient space on the mainAxis, it will expand the display to the crossAxis.
Attributes:
5. Stateful components
A custom component in Flutter is actually a class, which needs to inherit StatelessWidget/StatefulWidget.
statelessWidget is a stateless component, the state is immutable
widgetstatefulwidget is a stateful component, and the state held may change during the widget life cycle
In layman's terms: If we want to change the data in the page, we need to use Statefulwidget at this time
StatefulwidgetChange data must use setState