이번 시간에는 탭을 누르면 선택된 탭과 선택되지 않은 탭을 구별해주고, 탭 별로 화면도 보여주겠습니다.
이전 포스팅은 아래 링크를 들어가시면 됩니다.
2022.06.14 - [안드로이드] - [안드로이드 코틀린] Tab Custom Animation part1 - 화면 구성 및 설정
[안드로이드 코틀린] Tab Custom Animation part1 - 화면 구성 및 설정
앞으로 TabLayout을 직접 만들어 애니메이션 기능까지 넣어보도록 하겠습니다. 이번 시간에는 화면 구성 및 설정을 만들어 보겠습니다. 목차 1. 실행 화면 2. dataBinding 설정 build.gradle 3. 테마 변경 t
aries574.tistory.com
- 설명 -
각 탭을 누르면 보이는 화면
2022.01.08 - [안드로이드] - [안드로이드 스튜디오] 프래그먼트(Fragemnt) 만드는 방법
[안드로이드 스튜디오] 프래그먼트(Fragemnt) 만드는 방법
이번 시간에는 안드로이드 스튜디오에서 프래그먼트 화면을 추가하는 방법을 알아보겠습니다. app 선택 -> 마우스 오른쪽 -> New -> Fragment 다양한 버전의 Fragment가 있어 쓰임에 따라 골라 만드시면
aries574.tistory.com
class OneFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_one, container, false)
}
}
class TwoFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_two, container, false)
}
}
class ThreeFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_three, container, false)
}
}
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".OneFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="FragmentOne"
android:textSize="30sp" />
</FrameLayout>
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".TwoFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="FragmentTwo"
android:textSize="30sp" />
</FrameLayout>
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ThreeFragment">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="FragmentThree"
android:textSize="30sp" />
</FrameLayout>
- 설명 -
1. private fun selectTab(tabNumber: Int)
탭 선택 이벤트
2. selectedTextView
선택된 TextView 담을 변수
3. nonSelectedTextView1
선택안된 TextView 담을 변수1
4. nonSelectedTextView2
선택 안된 TextView 담을 변수2
5. selectedFragment
선택된 Fragment 담을 변수
6. supportFragmentManager.beginTransaction()
프래그먼트 설정
class MainActivity : AppCompatActivity() {
private lateinit var binding: ActivityMainBinding
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//binding 초기화
binding = DataBindingUtil.setContentView(this, R.layout.activity_main)
//디폴트 설정(1번탭)
selectTab(1)
//1번탭 클릭 이벤트
binding.tabItem1.setOnClickListener {
selectTab(1)
}
//2번탭 클릭 이벤트
binding.tabItem2.setOnClickListener {
selectTab(2)
}
//3번탭 클릭 이벤트
binding.tabItem3.setOnClickListener {
selectTab(3)
}
}
//탭 선택 이벤트
private fun selectTab(tabNumber: Int){
var selectedTextView: TextView //선택 탭
var nonSelectedTextView1: TextView//비선택 탭
var nonSelectedTextView2: TextView//비선택 탭2
var selectedFragment: Fragment //선택 프래그먼트
if(tabNumber == 1){
selectedTextView = binding.tabItem1
nonSelectedTextView1 = binding.tabItem2
nonSelectedTextView2 = binding.tabItem3
selectedFragment = OneFragment()
}else if(tabNumber == 2){
selectedTextView = binding.tabItem2
nonSelectedTextView1 = binding.tabItem1
nonSelectedTextView2 = binding.tabItem3
selectedFragment = TwoFragment()
}else{
selectedTextView = binding.tabItem3
nonSelectedTextView1 = binding.tabItem1
nonSelectedTextView2 = binding.tabItem2
selectedFragment = ThreeFragment()
}
//프래그먼트 설정
supportFragmentManager.beginTransaction()
.setReorderingAllowed(true)
.replace(R.id.fragmentContainer, selectedFragment, null)
.commit()
//선택 탭 설정
selectedTextView.setBackgroundResource(R.drawable.round_back_white_100)
selectedTextView.setTypeface(null, Typeface.BOLD)
selectedTextView.setTextColor(Color.BLACK)
//비선택 탭 설정
nonSelectedTextView1.setBackgroundColor(ContextCompat.getColor(applicationContext,
android.R.color.transparent))
nonSelectedTextView1.setTypeface(null, Typeface.NORMAL)
nonSelectedTextView1.setTextColor(Color.parseColor("#80FFFFFF"))
nonSelectedTextView2.setBackgroundColor(ContextCompat.getColor(applicationContext,
android.R.color.transparent))
nonSelectedTextView2.setTypeface(null, Typeface.NORMAL)
nonSelectedTextView2.setTextColor(Color.parseColor("#80FFFFFF"))
}
}
2022.06.06 - [안드로이드] - [안드로이드 코틀린] 커스텀 달력 만드는 방법 part1 화면 구성
[안드로이드 코틀린] 커스텀 달력 만드는 방법 part1 화면 구성
이번 시간부터 코틀린 버전 커스텀 달력을 만들어보겠습니다. 이번 포스팅은 화면 구성입니다. 목차 1. 실행 화면 2. dataBinding 설정 3. 메인 화면 구성 activity_main.xml 1. 실행 화면 2. dataB..
aries574.tistory.com
2022.05.28 - [안드로이드] - [안드로이드 코틀린] 함수(function) 만드는 방법 part4 - 오버 로딩(Overloading)
[안드로이드 코틀린] 함수(function) 만드는 방법 part4 - 오버로딩(Overloading)
이번 시간에는 함수명이 같은 함수(Overloading) 만드는 방법에 대하여 알아보겠습니다. 목차 1. 실행 화면 2. 메인 화면 구성 activity_main.xml 3. 메인 코드 구현 MainActivity.java 1. 실행 화면..
aries574.tistory.com
2022.06.02 - [안드로이드] - [안드로이드 코틀린] DataBinding 컴포넌트 쉽게 접근하는 방법
[안드로이드 코틀린] DataBinding 컴포넌트 쉽게 접근하는 방법
이번 시간에는 Databinding를 통해 레이아웃 컴포넌트에 쉽게 접근하는 방법을 코틀린으로 구현해보도록 하겠습니다. 목차 1. 실행 화면 2. dataBinding 설정 3. 메인 화면 구성 activity_main.xml 4. 메인 코
aries574.tistory.com
[안드로이드 코틀린] 정해진 시간에 알람 울리는 방법 Notification TimePickerDialog part1 - 설정 (0) | 2022.06.17 |
---|---|
[안드로이드 코틀린] Tab Custom Animation part3 - 탭 애니메이션 적용 (0) | 2022.06.16 |
[안드로이드 코틀린] Tab Custom Animation part1 - 화면 구성 및 설정 (0) | 2022.06.14 |
[안드로이드 코틀린] 커스텀 달력 만드는 방법 part8 이번 달만 색상 진하게 변경하기 (2) | 2022.06.13 |
[안드로이드 코틀린] 커스텀 달력 만드는 방법 part7 달력 표시 변경하기 (0) | 2022.06.12 |
댓글 영역