+1

[SwiftUI] Shadow, Padding

SwiftUI: Shadow

Trong hướng dẫn này, chúng ta sẽ tìm hiểu Shadow trong SwiftUI là gì. Bạn sẽ học được:

  • Cách sử dụng Shadow.

Điều kiện tiên quyết

Để làm theo hướng dẫn này, bạn sẽ cần một số kiến thức cơ bản về:

  • Cơ bản về Swift.
  • Xcode 11 trở lên

Shadow

Việc thêm shadow và corner radius là một mớ hỗn độn trong UIKit, bạn sẽ cần tạo hai view để đạt được điều đó. Dưới đây chỉ là một ví dụ về việc bao gồm cả radius và shadow.

Rectangle()
.fill(Color.green)
.cornerRadius(4.0)
.shadow(radius: 4.0)
.frame(width: 200, height: 200)

Bạn có thể điều chỉnh radius của shadow.

.shadow(radius: 20.0)

Bạn thậm chí có thể di chuyển shadow xung quanh với trục x và y.

.shadow(color: Color.blue, radius: 20, x: 50, y: 50)

SwiftUI: Padding

Padding

Padding tự động thêm 16px cho mỗi bên.

VStack {
    Rectangle()
        .fill(Color.green)
        .frame(width: 200, height: 200)
        .padding()
        .border(Color.red)
 
}

Có lẽ padding hơi lớn. Thử đổi padding thành 10px.

.padding(10.0)

Bạn có thể chỉ padding bên trái.

.padding(.leading, 10)

Bạn lại đổi ý và muốn padding ở bên trái và bên phải.

.padding(.horizontal)

Bạn có thể làm một cái gì đó khác một chút.

.padding([.leading, .bottom])

Cảm ơn bạn đã theo dõi bài viết tới đây, mong nó sẽ giúp ích.

Nguồn: Internet.


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí