안녕하세요 오늘은 회원가입 창을 만들어 보았습니다. 오늘 몇가지 Post를 해보자고 하면 일단 텍스필드에 왼쪽으로 Padding을 주는것인데요! 일단 코드로 먼저 살펴보겠습니다!
회원가입 쪽만 구현을 했습니다!
사실 조금 달라진 부분이 있긴 합니다..ㅎㅎ 옵젝들 사이사이에 간격을 조금 늘려서 그런가 view가 조금 모자르더라구요 그래서 스크롤뷰를 사용을 할까 하다가 페이지수를 2개로 늘리기로 결정했어요 조금 깔끔한게 좋아서요
아직 UI적인것만 구현을 해놓은거라 다양한 액션은 보여드리기 힘들지만 어떻게 코드가 진행된거지 한번 말씀드려보겠습니다!
일단 첫번째! NSMutableAttributedString
이거는 쉽게 말해서 그냥 label에 텍스트 를 각자 다른 폰트 다른색상으로 지정할수 있게 해주는 함수라고 보시면 됩니다!.
평상시에 여러분은 어떻게 하셨나요? 저는 메인Label밑에 Sub라벨을 총 2개씩이나 만들어서 항상 부가설명을 적곤 했어요.. 그치만 저함수만 있으면 그러지 않아도 됩니다.!
코드만 보셔도 상당히 쉬워 보이죠?? 정말 간단합니다.
그리고 보시면 emailLabel의 font와 textFontSize의 폰트가 달라지는데요 addAttribute 하지 않는 부분의 텍스트들은 emailLabel font를 따라가게 됩니다.
이런식으로요 ㅎㅎ 그점만 유의 하면 어려울꺼 없는 함수였습니다 ㅎㅎ
그다음은! UITextField Padding 인데요
textField 각방향으로 view를 넣을수 있습니다. 그렇기때문에 빈공간(보이지않는view)도 넣고 이미지도 넣을수 있어요
사실 저는 padding값을 10밖에 주지않아서 조금 차이를 못느낄수도 있습니다 ㅎㅎ
일단 코드먼저 보시면
자 이런식으로 텍스트필드를 익스텐션 해주셔서 함수만 몇개 만들어주시면 끝납니다!
self.leftView 가 보이시나요? 저것처럼 텍스트필드 안에는 뷰를 넣을수 있는 공간이 존재하는것이였어요!ㅎㅎ
또 그렇기때문에 leftImagePadding을 보시면 파라미터로 이미지를 받고 그 이미지로 이미지뷰를 만들어서 padding 하는게 보이시죠! 아주 간단하게 ui를 만들수 있습니다
그다음은! RadioButton 인데요
사실 iOS 에는 라디오버튼이 존재하지 않아요...그래서 만들어야됩니다 ㅎㅎ
사실 깃허브나 여러 좋은 라이브러리들이 있어서 아~~~주 쉽게 구현 할수있지만 저는 라이브러리를 의존도를 낮추기 위해서 ! 사용하지 않고 구현해봤습니다!
이것도 처음에 접근이 조금어려웠지 간단하더라구요!! 일단 ViewController에 버튼을 두개 만들어주세요!
되셨으면 이제 이 버튼들을 라디오로 만들어 줘야겠지용 인스펙터에 파일을 하나 만들겠습니다ㅎ
그 후에 class 를 하나 만들껀데요 상속 타입은 NSObject 로 받겠습니다
그리고 나서 함수를 만들어줄껀데요 로직이 어떻게 돌아가는 것이냐면!
일단 아까 만든 yes , no 버튼을 배열로 받을겁니다 그렇게 때문에 그걸 받을
배열형버튼이 필요하구요 그럼 그 버튼안에 있는 버튼들을 빼와서 이미지를 설정해줄꺼에요! .nomal 과 .selected 일때요! 말그대로 클릭했을때와 클릭하지 않았을때의 이미지를 설정해준뒤 버튼 클릭 액션이 될때마다 Bool 값을 넘겨 받으면 끝납니다 굉장히 간단하쥬??ㅎ
이런식으로 radio 에 있는 프로퍼티 값을 넘겨줍니다
디폴트는 아무거나 해도 상관없어요!
그 후에 AutoLayout을 잡아주시면 됩니다. ㅎ
radio 버튼 쪽이구요
버튼 액션입니다.
일단 defaultButton으로 설정 주었던 버튼이 함수를 시작하면서
isSeleted = true 가 됩니다 그렇게 되면 클릭되어있는 이미지가 선택이 되겠지요? 그럼 그 배열에 같이 있던 다른 버튼들은 .nomal 이 되기때문에 nomal 이미지가 설정이 되게됩니다. 그후에 유저가 클릭을 했을 경우에는 sender가 보내지면서 그 sender가 셀렉이 되었다 라는걸 알려주는것이겠죠? 그렇게되면 select이미지로 바뀌게 되구요! 아주 간단하게 RadioButton,UITextField Padding,NSMutableAttributedString 을 알아 보는 시간이였습니다!! 감사합니다
iOS/Android/FE/BE