# my_flutter

**Repository Path**: ldb-gitee/my_flutter

## Basic Information

- **Project Name**: my_flutter
- **Description**: No description available
- **Primary Language**: Dart
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-08
- **Last Updated**: 2020-12-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# my_flutter

A new Flutter project.

Transform.alignment：可以认为是坐标轴原点

RotatedBox是作用于layout阶段，所以子组件会旋转90度（而不只是绘制的内容），decoration会作用到子组件所占用的实际空间上。而Transform.rotate作用于paint阶段，不会影响子组件的位置和大小

DecoratedBox border的宽度包含在子控件的宽度里面，而Container border的宽度没有包含在子控件的宽度里面

[Matrix4讲解](https://medium.com/flutter-community/advanced-flutter-matrix4-and-perspective-transformations-a79404a0d828)


`Alignment(x, y)` in a rectangle with height h and width w describes 
the point (x * w/2 + w/2, y * h/2 + h/2) in the coordinate system of the 
rectangle.

Container(
    height: ph,
    width: pw,
    child: Align(
    alignment: Alignment(x, y),
    child: Container(
            height: ch,
            width: cw,
        ),
    ),
),
Alignment(x, y)  Alignment以中心点为原点，x, y的范围都是在-1到1之间。
设子控件的中心坐标为(cx, cy)，则x = (cx - pw / 2) / (pw / 2 - w / 2), y = (cy - ph / 2) / (ph / 2 - h / 2);

FractionalOffset(x, y) FractionalOffset以左上角为原点，因为FractionalOffset不方便文字方向不是ltr的显示，才有了Alignment;

Constraints go down. Sizes go up. Parent sets position.

父控件把constraints传给子控件，子控件根据constraints及自己想要的width\height得到最终的size。
父控件计算出子控件的位置。

当constaints的width/height最大值是Infinity时，子控件对应的width/height则是它想要的大小

ConstrainedBox给子控件增加constaints

UnconstrainedBox传给子控件的constraints为unconstraints，这样子控件可以得到自己想要的width\height

SizedBox指定width\height控制子控件

FractionallySizedBox将自己接收到的constaints的with\height乘以设置的withFactor\heightFactor作为constraints传给子控件，如果自己constraints是with\heightInfinity，同时又设置了withFactor\heightFactor，则会报错

LimitedBox当父控件传入的是unconstrained时才其作用max height\width控制子控件

SizedOverflowBox把父控件传过来的constraints直接传给子控件，子控件可以溢出

OverflowBox 是把其父控件传过来的constraints和其自身的min\max height\width结合后传入子控件，子控件可以溢出

FittedBox
fit参数表示了子控件的填充方式，说明如下：
fill：填充父组件，宽高比发生变化。
contain：等比拉伸，但子控件不能超出父控件。与fitWidth、fitHeight中比例较小的情况效果一样。
cover：尽可能的小，等比拉伸充满父控件。与fitWidth、fitHeight中比例较大的情况效果一样。
fitWidth：等比拉伸，宽充满父控件。
fitHeight：等比拉伸，高充满父控件。
none：默认子控件居中，不做拉伸处理，超出父控件的部分裁剪。
scaleDown：在子控件为Image且缩小的情况和contain一样，否则和none一样。

RotatedBox可以旋转的盒子


## Getting Started

This project is a starting point for a Flutter application.

A few resources to get you started if this is your first Flutter project:

- [Lab: Write your first Flutter app](https://flutter.dev/docs/get-started/codelab)
- [Cookbook: Useful Flutter samples](https://flutter.dev/docs/cookbook)

For help getting started with Flutter, view our
[online documentation](https://flutter.dev/docs), which offers tutorials,
samples, guidance on mobile development, and a full API reference.