레쭈고 코틀린

Kotlin 7차시

정땅미 2024. 10. 21. 01:33

코틀린 7차식예요!

저희는 항상 배운 걸 또 배우고, 배운 걸 또 배우고를 반복하는데요우...

배울 때마다 기억이 나지 않는다니 너무 신기해요...~

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/btn1"
        android:layout_gravity="right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />
    <TextView
        android:id="@+id/text1"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView" />
    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="CheckBox" />
    <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="RadioButton" />
    <Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Switch" />
    <ImageView
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/gaul" />
</LinearLayout>

 

이 코드는 전에 배웠던 위젯들을 모조리 사용한 예제이구요.~

새롭게 사용한 것은

android:layout_gravity="right"

 

이 코드입니다! layout_gravity 는 내가 부모에서 어디에 위치할지 정하는 속성입니당.

<Switch
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Switch" />

 

그리고 Switch 위젯도 처음 사용해 봣는데 on, off 가 가능하고, 나머지 사용하는 것들은 똑같더라구요!

그래서 나온~ 결과물은 

 

이것입니당.  (* ̄3 ̄)╭

아주아주 간단한 예제였어유

 

그 다음 예제는

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:layout_weight="1"
        android:orientation="vertical" >
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼1" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼2" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#00ff00"
        android:layout_weight="1"
        android:gravity="center"
        android:orientation="horizontal" >
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼3" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼4" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:background="#0000ff"
        android:layout_weight="1"
        android:orientation="vertical" >
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼5" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="버튼6" />
    </LinearLayout>
</LinearLayout>

 

이 코드였어유

android:gravity="center"

 

여기서 gravity 는 자식들을 어떻게 배치시킬지 결정하는 속성이에요!

그리고,

android:layout_weight="1"

 

이 코드는 비율을 나타내 주는 코드예요!

결과 화면을 보고, 설명하겠습니당 (*^-^*)

 

우선 이 전체를 감싸고 있는 레이아웃 안에서 세 색상끼리의 레이아웃을 만들어줍니닷.

그 후에 첫 번째, 세 번째 박스는 orientation 을 vertical 로 설정해 줘요!

그리고 두 번째 박스는 horizantal 로 설정해 주시면 됩니닷!!!!!

그럼 버튼이 수직 혹은 수평 정렬이 되어요!

레이아웃마다 layout_weight 를 1 로 맞춰서 각각의 색이 차지하는 비율을 똑같이 해 주었어유!!!

이게 가장 새롭게 배운 코드인 것 같습니당.

 

또 다른 레이아웃들도 몇 개 배웠는데유~

바로, TableLayout, GridLayout 이렇게 배웠어요!

TableLayout 은 표 형태로 만드는 형식이라 딱히 실습하지 않았구요!!!

GridLayout 코드를 보여드릴게유

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:rowCount="2">
    <Button
        android:layout_column="0"
        android:layout_row="0"
        android:layout_rowSpan="2"
        android:layout_gravity="fill_vertical"
        android:text="1" />
    <Button
        android:layout_column="1"
        android:layout_columnSpan="2"
        android:layout_row="0"
        android:layout_gravity="fill_horizontal"
        android:text="2" />
    <Button
        android:layout_column="3"
        android:layout_row="0"
        android:text="3" />
    <Button
        android:layout_column="1"
        android:layout_row="1"
        android:text="4" />
    <Button
        android:layout_column="2"
        android:layout_row="1"
        android:text="5" />
    <Button
        android:layout_column="3"
        android:layout_row="1"
        android:text="6" />
</GridLayout>

 

이것은 GridLayout 예제인데유

HTML 에서 배우는 것이랑 비슷해서 좋았어요!!

layout_column 과 layout_row 를 사용하여서 어느 인덱스에 지정해 줄 지 우선 정해요!

이는 0 부터 시작하며 행과 열을 잘 구분해 줘야 해요!

그리고 rowSpan, columnSpan 을 사용해서 몇 칸을 먹을지 정해요!

저 코드에서도 그런 식으로 해 줬구 행과 열만 잘 구분해 준다면 어려울 건 없는 코드입니당.

 

그래서 총 결과 화면은 이렇습니당~! ^o^

처음 코드 쓸 땐 이해 안 하고 써서... 어려웠는데 이해하니까.. 쉽더라구요 헤헷

오늘은 이렇게 배웠구요!

중복되는 배운 내용으로는

setContentView(R.layout.activity_main)
title = "학번 이름 레이아웃 익히기 + 이벤트 처리"
var btn1 = findViewById<Button>(R.id.btn1)
var text1 = findViewById<TextView>(R.id.text1)
btn1.setOnClickListener {
    text1.setText("버튼이 클릭~~~~~");   // 방법 1
    // text1.text = "button click";        // 방법 2

 

버튼 처리를 배웠어유! 우선 btn1, text1 이라는 변수에 해당하는 id 값을 넣어주고

btn1 이 이벤트처리가 되었을 때 textview 인 text1 의 text 가 바뀌는 걸 해 줬구요

이는 방법이 두 개가 있어요! 더 편하신 걸 선택하시면 됩니당. (*^-^*)

그리고 첫 줄에서 activity_main 말고 다른 파일로 바꿔주시면 그 파일과 연결이 되니까 이것도 참고해 주세요~!

 

그럼 이만, 모두 개발 파이팅!!!!!!!!!!!!!!!!

'레쭈고 코틀린' 카테고리의 다른 글

Kotlin 9차시  (1) 2024.10.31
Kotlin 8차시  (3) 2024.10.23
Kotlin 6차시  (3) 2024.09.27
Kotlin 5차시  (1) 2024.09.26
Kotlin 4차시  (4) 2024.09.13