개발하는 두더지

ButtonBar를 이용하면 버튼의 배치를 쉽게 할 수 있습니다. ButtonBar 위젯을 만들고 내부에 Button 위젯들을 넣어주면 수평으로 배치해줍니다. 버튼에는 FlatButton 과 RaisedButton 이 있습니다. 각각 Material 가이드라인에서 TextButton 과 Contained Button 으로 설명하고 있습니다. 하나는 버튼의 배경색이 없이 텍스트만있고, 다른 하나는 버튼의 배경색과 텍스트로 이루어져 있습니다. 왜 이렇게 나눠놨을까요? Material 가이드라인에 따르면 하나의 레이아웃에는 눈에 띄는 버튼이 있어야 한다고 합니다. 눈에 잘 띄는 버튼은 사용자가 앱을 통해 진행하기를 바라는 행동을 나타낸다고 하는데 그런 의미에서 버튼 위젯을 나눈 것이라 생각합니다. TextEd..

로그인을 할 때 보통 사용자 Id, 비밀번호를 입력합니다. 2개의 입력 폼 UI를 구현하기 위해 TextField 를 이용해보도록 하겠습니다. TextField 위젯을 사용하면 리플효과(터치하면 물결처럼 퍼지는 터치 효과)가 적용됩니다. decoration 값에는 InputDecoration 위젯이 들어갑니다. filled: 에는 TextField 의 어느 영역을 터치해야되는지 알려주기 위해 배경에 적당한 색을 입혀줍니다. obscureText 는 비밀번호를 입력할 때 *** 로 표시되게 해줍니다. SizedBox 는 여백을 주기에 적절한 위젯입니다. height 값을 적절히 설정하여 너무 붙어있지 않게합니다. TextField( decoration: InputDecoration( filled: true..