# PRJ_3. 커뮤니티 게시판 앱_(1) 로그인 화면

728x90

🟦 31강, 32강 프로젝트 생성

📗 ViewBinding 설정

  • app 수준의 build.gradle파일에 다음을 추가
buildFeatures{
viewBinding = true
}
  • MainActivity 에서 바인딩 변수 선언 후 onCreate() 에서 연결
class MainActivity : AppCompatActivity() {

    lateinit var mainActivityBinding : ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        mainActivityBinding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(mainActivityBinding.root)

    }
}

🟦 34강. 로그인 화면 구성

📗 로그인 화면 구성

  • Splash 화면 끝난 후 곧바로 로그인 화면이 나타남
  • 로그인 화면 속에는 회원 가입 버튼 존재
  • 로그인 후 게시판의 첫 화면 등장하도록 할 것
  • ‘프래그먼트’ 화면들로 만들 예정

📍theme.xml

  • 먼저 액션바를 없앤다
  • 각 프래그먼트 별 ‘툴바’ 배치해서 사용할 목적
  • <!-- 기본 액션바 없애기 --> <item name = "windowActionBar">false</item> <item name = "windowNoTitle">true</item>

📌 액션바 VS 툴바

  • 액션바 : 액티비티에 자동 포함되는 구성요소
  • 툴바 : 개발자가 직접 제어하는 ‘뷰’ 속성

🟧 애플리케이션 구성

각 액티비티 규격 안에 여러 개의 프래그먼트 화면들을 담는 형태.

  • 애플리케이션의 모든 화면은 Fragment(프래그먼트)로 구성한다.
  • Activity(액티비티)는 Fragement를 관리하는 역할을 담당한다.
  • 하나의 기능이 완료되면 새로운 Activity를 실행하는 구조로 처리한다.

📍백 스택이란?

Task, Activity, 백 스택


Task는 사용자가 특정 작업을 할 때 상호작용하는 Activity의 집합입니다. 하나의 Task에는 액티비티 집합을 열린 순서대로 정렬해놓는 백 스택이 존재합니다. 백 스택Stack의 성질을 가지고 있으며 가장 최신에 열린 액티비티가 가장 맨위로 위치하게 됩니다.

예를 들어서 이메일 앱에는 새 메시지 목록을 표시하는 액티비티가 존재하고, 사용자가 메시지 목록에서 메시지를 하나 클릭하면 메시지의 내용을 상세하게 볼 수 있도록 새로운 액티비티가 열리게 됩니다. 이때 메시지 상세보기 액티비티는 백 스택에 추가되며, 만약에 사용자가 뒤로가기 버튼을 탭하면 메시지 상세보기 액티비티는 백 스택에서 pop됩니다.

사용자가 계속 뒤로 버튼을 누르면 계속 이전 액티비티가 나타나며, 만약 모든 액티비티가 스택에서 삭제되면 Task는 더 이상 존재하지 않게 됩니다. 사용자가 새 Task를 시작하거나 홈 버튼을 통해 홈 화면으로 이동할 때 현재 Task는 통째로 백그라운드로 이동합니다. Task의 모든 액티비티는 백그라운드에 있는 동안 모두 중지되지만, Task의 백 스택은 그대로 유지됩니다. 이후에 Task가 다시 포그라운드로 돌아가게 되면 백 스택이 유지 되어있기에 사용자는 스택의 가장 상단에 있는 액티비티를 그대로 이어나갈 수 있습니다.

◾ MainActivity.kt

package com.example.app3_communityapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentTransaction
import com.example.app3_communityapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {
    //바인딩 설정
    lateinit var mainActivityBinding : ActivityMainBinding
    // 프래그먼트 담을 변수 선언
    lateinit var currentFragment : Fragment

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        mainActivityBinding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(mainActivityBinding.root)
        //프래그먼트 컨트롤 메소드
        fragmentController("login", false, false)
    }

    //이 메인 액티비티가 관리할 프래그먼트 화면들을 컨트롤할 메소드
    // (프래그먼트 이름/ 백 스택에 추가 여부 / 애니메이션 동작 사용 여부)
    fun fragmentController(name:String, add:Boolean, animate:Boolean) {

        //1) 띄울 프래그먼트 이름받아서 생성
        when(name) {
            "login" -> {
                currentFragment = LoginFragment()
            }
        }
        //트랜잭션으로 띄울 현재의 프래그먼트 띄움
        val trans =supportFragmentManager.beginTransaction()
        trans.replace(R.id.main_container, currentFragment)

        //2) 백 스택에 추가 여부 따라서 ("뒤돌아가기 기능"동작 위해서 사용) - T: 뒤로가기 F:종료
        if(add == true) {
            trans.addToBackStack(name)
        }

        //3) 애니메이션 사용 여부에 따라서
        if(animate == true) {
            trans.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN)
        }

        trans.commit()

    }

}

◾ LoginFragment.kt

package com.example.app3_communityapp

import android.os.Bundle
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import com.example.app3_communityapp.databinding.FragmentLoginBinding

class LoginFragment : Fragment() {
    //바인딩 설정
    lateinit var loginFragmentBinding : FragmentLoginBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment

        loginFragmentBinding = FragmentLoginBinding.inflate(inflater)
        loginFragmentBinding.loginToolbar.title= "로그인"

        return loginFragmentBinding.root
}

 

728x90