openplanning

Hướng dẫn và ví dụ Flutter Alignment

  1. Flutter Alignment
  2. Examples

1. Flutter Alignment

Alignment được sử dụng để định nghĩa cách căn chỉnh (align) vị trí của một widget con bên trong cha của nó.
  • Hướng dẫn và ví dụ Flutter AlignmentGeometry
  • Hướng dẫn và ví dụ Flutter AlignmentDirectional
Alignment Constructor
const Alignment(
   double x,
   double y
)
Flutter đặt một hệ toạ độ tại trung tâm của widget cha, và bạn có thể tạo ra một đối tượng Alignment từ 2 tham số xy để mô tả cách căn chỉnh (align) vị trí của widget con.
Lớp Alignment định nghĩa sẵn một vài hằng số ứng với các ví trị thông dụng:
Constant
Define
bottomCenter
Alignment(0.0, 1.0)
bottomLeft
Alignment(-1.0, 1.0)
bottomRight
Alignment(1.0, 1.0)
center
Alignment(0.0, 0.0)
centerLeft
Alignment(-1.0, 0.0)
centerRight
Alignment(1.0, 0.0)
topCenter
Alignment(0.0, -1.0)
topLeft
Alignment(-1.0, -1.0)
topRight
Alignment(1.0, -1.0)

2. Examples

Container (
  decoration: BoxDecoration (
    image: const DecorationImage(
      image: NetworkImage('https://s3.o7planning.com/images/tom-and-jerry.png'),
      fit: BoxFit.cover,
    )
  ),
  margin: EdgeInsets.all(10),
  alignment: Alignment.bottomLeft,
  child:  Text (
    "Tom and Jerry",
    style: TextStyle(
        fontSize: 20,
        color: Colors.red,
        fontWeight: FontWeight.bold
    ),
  )
)

Các hướng dẫn lập trình Flutter

Show More