자기소개 앱 개발 - 회원가입 페이지(Level 2)

📺 화면 구성 (Level 1)

1. 새 프로젝트를 만들고 MainActivity의 이름을 SignInActivity로 변경

2. 원하는 로고 image 추가

3. 아이디, 비밀번호를 입력받는 EditText 추가 (미리보기 글씨 있어야함)

4. 비밀번호 EditText는 입력 내용이 가리기

5. 로그인 버튼을 누르면 HomeActivity가 실행 (Extra로 아이디 넘기기)

6. 아이디/비밀번호 모두 입력 시에만 로그인 버튼이 실행됩니다. (“로그인 성공”이라는 토스트 메세지 출력)

7. 아이디/비밀번호 중 하나라도 비어 있다면 “아이디/비밀번호를 확인해주세요” 라는 토스트 메세지 출력

8. 회원가입 버튼을 누르면 SignUpActivity가 실행됩니다.

👉 4번까지 완료했고, Level 1에서 구현해야하는 로그인 화면 기능 구현을 마무리 !

---

🖇️ 버튼 연결

버튼 연결은 앞서 배웠던 실습에서 자주 해봤다. 먼저, findViewById를 통해 Id에 해당하는 버튼을 상수로 생성한다. 그리고 각 버튼을 SetOnClickListener을 이용해서 버튼을 클릭시의 Activity를 설정해주면 된다.

---

🤷‍♀️ Extra로 아이디 넘기기

PutExtra를 이용해서 아이디를 HomeActivity로 넘겨줬다. 이렇게 하면 이제 SigninActivity에서 입력했던 아이디를 HomeActivity로 넘어가게 된다.

---

🔒 로그인 버튼 활성화 / 비활성화

일단 ID와 Password를 설정해줬고, 이를 통해 ID와 Password가 일치한다면 '로그인 성공!' 이라는 문구가 출력되면서 로그인 버튼이 활성화 되어 HomeActivity 화면으로 넘어가고, ID와 Password가 일치하지 않거나, 비어있다면 '아이디/비밀번호를 확인해주세요!' 라는 문구가 출력되도록 구현했다.

👉 Toast.makeText(this, "문구", Toast.LENGTH_SHORT).show() 를 통해 문구 출력

내가 설정한 아이디 및 비밀번호가 아니라, 따로 회원가입을 통해 가입한 아이디와 비밀번호로 로그인이 가능하도록 구현해야할 것 같은데, 이건 회원가입을 설정하면서 추가로 설정해주면 될 것 같다.

그럼 이렇게 되면 Level 1을 모두 구현했다.

💻 실행

---

📺 화면 구성 (Level 2)

1. SignUpActivity를 생성해 주세요.

2. 타이틀 이미지는 원하는 image로 넣어주세요.

3. 이름, 아이디, 비밀번호 모두 입력 되었을 때만 회원가입 버튼이 눌립니다.

4. 셋 중 하나라도 비어있으면 “입력되지 않은 정보가 있습니다.” 라는 토스트 메세지 출력

5. 비밀번호 EditText는 입력 내용이 가려져야 합니다.

6. 회원가입 버튼이 눌리면 SignInActivity로 이동합니다. (finish 활용)

이런식으로 UI를 구상했고 내일 이어서 구현할 예정이다.