본문 바로가기
공부/Android

하루 만에 배우는 안드로이드 앱 만들기 with 코틀린 (2주차)

by 유스베리이 2024. 3. 27.

Chapter 3

1. 뷰의 개념

뷰는 앱 화면에 보이는 모든 것들. 

모든 요소들의 기본이 되며, 그 모든 요소들은 뷰 클래스가 상속받아져야 함

 

TextView: 텍스트가 보이는 뷰

EditText: 텍스트를 입력받을 수 있는 기능이 있는 뷰

Button : 일반적으로 안드로이드 앱에서 볼 수 있는 클릭 기능이 포함된 뷰

ImageView : 이미지를 입력하여 나타내는 뷰

CheckBox : 다중 항목 중 선택의 유무를 체크할 수 있는 뷰

RadioButton: 선택 항목 중 하나만을 선택할 수 있는 뷰

 

2. 레이아웃

화면을 구성하는 형태 

 

LinearLayout : 화면 구성 요소들을 가로/세로 방향 순서로 배치되는 레이아웃

FrameLayout : 화면 구성 요소들을 중첩해 배치할 때 사용되는 레이아웃

TableLayout : 화면 구성 요소들을 행과 열로 배치할 때 사용되는 레이아웃

ConstraintLayout :  화면의 구성요소들 크기와 위치가 다른 요소들과 제약조건을 설정하여 배치하는 레이아웃

 

 

3. 리스트

리스트뷰는 목록형태를 구성하는 요소. 여러개의 목록에세 각자 세부적인 목록이나 기능을 동작할때 사용됨

 

4.텍스트 뷰

텍스트를 표시하기 위해 사용되는 뷰 

TextView

Plain Text

Password

Password(Numeric)

5. 이미지 뷰

이미지를 넣어 표현하는 뷰 

사진이나 이미지가 들어가는 앱을 사용하는데 필요한 뷰

이미지는 res > drawable 폴더에 넣으면 됨

 

6. 체크박스

 

 

7. 스크롤 뷰

스크롤 뷰를 사용해 화면 상하가 자유롭게 보이도록함

 

 

Chapter 4 실전 앱 만들기

1. 버튼을 눌렀을 때 반응하는 기능

        button.setOnclickListener{
            Toast.makeText(applicationContext,"나는 토스트 메세지 입니다 ", Toast.LENGTH_SHORT).show()

        }
class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)


        val btn1 = findViewById<Button>(R.id.button1)
        btn1.setOnclickListen {
            val intent = Intent(this, page1::class.java)
            startActivity(intent)
        }
        val btn2 = findViewById<Button>(R.id.button2)
        btn2.setOnclickListen {
            val intent = Intent(this, page2::class.java)
            startActivity(intent)
        }

 

class page1 : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContentView(R.layout.activity_page3)
        ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
            val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
            v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
            insets
        }
    }
}