SwiftUI의 ProgresssView 설계 조정

10397 단어 iOSSwiftSwiftUItech
iOS 14+ 이용 가능한 ProgresssView의 디자인 조정 노트.
import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack {
            ProgressView()
                .padding(.all, 16)
                .border(Color.black, width: 1)

            ProgressView()
                .scaleEffect(x: 2, y: 2, anchor: .center)
                .padding(.all, 16)
                .border(Color.black, width: 1)
                .progressViewStyle(CircularProgressViewStyle(tint: Color.green))

            ProgressView()
                .scaleEffect(x: 2, y: 2, anchor: .center)
                .padding(.all, 24)
                .background(Color.orange)
                .progressViewStyle(CircularProgressViewStyle(tint: Color.green))
                .cornerRadius(16)

            ProgressView()
                .scaleEffect(x: 2, y: 2, anchor: .center)
                .padding(.all, 24)
                .background(Color.orange)
                .progressViewStyle(CircularProgressViewStyle(tint: Color.green))
                .cornerRadius(16)
                .opacity(0.6)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        Group {
            ContentView().padding(.all, 16).preferredColorScheme(.light).previewLayout(.sizeThatFits)
            ContentView().padding(.all, 16).preferredColorScheme(.dark).previewLayout(.sizeThatFits)
        }
    }
}
미리 보기.

메모지


확대/축소 렌더링에 사용됩니다scaleEffect.
func scaleEffect(x: CGFloat = 1.0, y: CGFloat = 1.0, anchor: UnitPoint = .center) -> some View
안의 그룹의 색을 바꿀 때 CircularProgressViewStyle tintcolor를 지정합니다.

좋은 웹페이지 즐겨찾기