Android

[안드로이드/AppBar] AppBar Layout

gangmini 2023. 4. 28. 00:55
반응형

AppBar Layout

  • ToolBar 와 다른 View들을 관리하기 위해 제공되는 레이아웃
  • AppBar Layout 안에 툴바를 배치하고 이미지뷰와 같은 또다른 뷰를 배치해주면 접히고 펼치는 효과를 구현 가능 (묶어서 관리)
  • 반드시 CoordinatorLayout 안에 포함되어야 함 (이를 통해 다른 뷰들과 연동)

CoordinatorLayout

  • View를 배치하기보다는 관리하는 목적으로 사용 (자신 안에 배치된 뷰들의 상태를 감지하고 다른 뷰에게 명령 처리 가능!)
  • 배치된 View에서 어떠한 사건이 발생하면 이를 감지해 다른 View들에게 전달하거나, 혹은 스스로 어떤 처리를 할 수 있는 레이아웃 
  • 스크롤 가능한 툴바 구현 가능 (coordinator layout이 있는 부분을 스크롤 -> coordinator layout가 스크롤 감지해 앱바(안에 툴바)에 전달 -> 앱바(안에 툴바)가 스스로 접혔다 펼쳤다 하면서 다른뷰도 보여주고 난리부르스~~)

  • NestedScrollView 를 잡고 스크롤하면 앱바(안에 툴바)가 접혔다 펴졌다 함 (스크롤 행위 -> / )
  • NestedScrollView은 vertical LinearLayout (방향은 반드시 수직만) 
  • NestedScrollView 스크롤 행위 ->코디네이터레이아웃 -> 앱바
  • 앱바 스크롤 행위 -> 코디네이터레이아웃 -> NestedScrollView

앱바에 셋팅한 이미지뷰의 프로퍼티

  • layout_collapseMode : pin -> 스크롤 펼칠때 이미지가 고정 / parallax -> 이미지 사이즈가 맞게 약간 조정 
class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater) // 뷰바인딩 객체
        val view = binding.root //뷰바인딩을 통해 레이아웃과 뷰가 결합 -> .root 를 통해 View 객체만를 뽑아내는(?)
        setContentView(view)

        setSupportActionBar(binding.toolbar)

        binding.toolbarLayout.setCollapsedTitleTextColor(Color.WHITE) //접혀졌을때 색상
        binding.toolbarLayout.setExpandedTitleColor(Color.GREEN)      //펼쳐졌을때 색상

        binding.toolbarLayout.collapsedTitleGravity = Gravity.CENTER_HORIZONTAL
        binding.toolbarLayout.expandedTitleGravity = Gravity.LEFT + Gravity.TOP

        //코드를 통해 이미지 바꾸기
        binding.imageView3.setImageResource(R.drawable.img2)

        //앱바 타이틀 변경
        supportActionBar?.title = "타이틀"

    }
}

상단 앱바 스크롤해서 이미지뷰 보이기~!~!

반응형