openplanning

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

Xem thêm các chuyên mục:

Nhóm phát triển của chúng tôi vừa ra mắt website langlearning.net học tiếng Anh, Nga, Đức, Pháp, Việt, Trung, Hàn, Nhật, ... miễn phí cho tất cả mọi người.
Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất.
Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi.
Hãy theo dõi chúng tôi trên Fanpage để nhận được thông báo mỗi khi có bài viết mới. Facebook

1- Flutter EdgeInsets

EdgeInsets giúp tạo ra outer padding (phần đệm bên ngoài) hoặc inner padding (phần đệm bên trong) cho một Widget dựa trên các tham số trực quan left, top, right, bottom, nó không phụ thuộc vào hướng của văn bản (text direction).
Để hỗ trợ cả bố cục từ trái sang phải và từ phải sang trái, hãy xem xét sử dụng EdgeInsetsDirectional.
  • TODO Link?

2- EdgeInsets.all

Constructor EdgeInsets.all được sử dụng để tạo ra một đối tượng EdgeInsets với cùng một giá trị cho cả bốn property left, top, right, bottom.

const EdgeInsets.all(
   double value
)
EdgeInsets.all (ex1)

Container (
    margin: EdgeInsets.all(80),
    color: Colors.greenAccent,
    child:Text(
        "Hi There!",
        style: TextStyle(fontSize: 28)
    )
)

3- EdgeInsets.fromLTRB

Constructor EdgeInsets.fromLTRB được sử dụng để tạo ra một đối tượng EdgeInsets dựa trên các giá trị left, top, right, bottom.

const EdgeInsets.fromLTRB(
    double left,
    double top,
    double right,
    double bottom
)
EdgeInsets.fromLTRB (ex1)

Padding (
    padding: EdgeInsets.fromLTRB(80, 100, 70, 50),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

4- EdgeInsets.only

Constructor EdgeInsets.only tạo ra một đối tượng EdgeInsets từ các tham số tuỳ chọn left, top, right, bottom, các tham số không được chỉ định sẽ có giá trị bằng 0.

const EdgeInsets.only(
    {double left: 0.0,
    double top: 0.0,
    double right: 0.0,
    double bottom: 0.0}
)
EdgeInsets.only (ex1)

Container (
    color: Colors.greenAccent,
    padding: EdgeInsets.only(left: 120, top: 50, right: 80),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

5- EdgeInsets.symmetric

Constructor EdgeInsets.symmetric tạo ra một đối tượng EdgeInsets đối xứng từ hai tham số horizontalvertical. Điều này có nghĩa là:
  • left = right = horizontal
  • top = bottom = vertical

const EdgeInsets.symmetric(
    {double vertical: 0.0,
    double horizontal: 0.0}
)
EdgeInsets.symmetric (ex1)

Container (
    color: Colors.greenAccent,
    padding: EdgeInsets.symmetric(horizontal: 120, vertical: 50),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

6- EdgeInsets.fromWindowPadding


const EdgeInsets.fromWindowPadding(
    WindowPadding padding,
    double devicePixelRatio
)

Xem thêm các chuyên mục: