📘 Flutter/Flutter for SwiftUI Devs

Flutter for SwiftUI Devs - Adding Buttons

이오🐥 2023. 1. 12. 10:00

 Buttons 

SwiftUI에서 버튼을 만들기 위해서 Button struct를 이용하면 된다.

Button("Do something") {
  // this closure gets called when your
  // button is tapped
}

Button을 만들고 iPhone 14 Pro Max 시뮬레이터로 build 한 모습니다.

 

Flutter에서 똑같이 만들려면, CupertinoButton class를 이용하면 된다.

        CupertinoButton(
  onPressed: () {
    // This closure is called when your button is tapped.
  },
  child: const Text('Do something'),
)

Flutter는 다양한 버튼이 이미 정의되어 있고, 버튼을 사용할 수 있다. CupertinoButton은 Cupertino 라이브러리에서 가져와 사용하는데, Apple의 디자인 시스템을 이용하려면 Cupertino 라이브러리의 widget들을 사용하면 된다.

 

아래 이미지는 Flutter로 CupertinoButton을 만들고, iPhone 14 Pro 시뮬레이터로 build 한 모습이다.

SwiftUI로 빌드한 모습과 아주 비슷하다. 실제로 버튼을 클릭했을 때, 글자 색이 연해졌다가 돌아오는 모습까지 비슷하다. 다른 점은 배경 색이 Flutter가 조금 더 회색이라는 점.

 

 


 

 

Flutter for SwiftUI Developers

Learn how to apply SwiftUI developer knowledge when building Flutter apps.

docs.flutter.dev