본문 바로가기
Study Log/Software Engineering

데이그램 따라하기 - 1. 사용되는 xml 만들기

by HZie 2020. 8. 6.

[사용되는 xml 만들기]

사용되는 레이아웃 종류
1. Linear Layout - 오브젝트(or 뷰)들을 리니어하게 정렬하여 보여주는 레이아웃
   - android.widget.LinearLayout에 속함
   - android:orientation : "horizontal"이나 "vertical로 설정할 수 있다. 설정하지 않으면 기본은 horizontal인듯
   - android:gravity : 포함한 뷰들을 어떻게 정렬시킬지 설정해둔다. ex) center
관련 api 문서 링크: https://developer.android.com/reference/android/widget/LinearLayout
 
2. Frame Layout - 여러 오브젝트(or 뷰) 중 하나를 전면으로 내세워서 보여주고 싶을 때 사용하는 레이아웃
관련 api 문서 링크: https://developer.android.com/reference/android/widget/FrameLayout

사용되는 뷰
1. Recycler View - List View의 발전된 버전
   - 동적 콘텐츠 화면에서 나타나는  부분을 표시하는데 필요한 뷰 홀더와 몇 개의 추가 뷰 홀더만 만들면 된다.
     (List View에서는 새로운 아이템을 표시할 때마다 뷰 홀더를 생성했다가 삭제하는데 Recycler View는 뷰홀더를 재사용한다.)
관련 api 문서 링크: 리사이클러뷰 문서
                          리스트뷰 문서
 
2. Image View - 이미지 리소스를 보여준다. 이미지 틴트와 스케일링도 가능하다.
관련 api 문서 링크: https://developer.android.com/reference/android/widget/ImageView

xml 코드

 

androidx.recyclerview.widget  |  Android 개발자  |  Android Developers

Content and code samples on this page are subject to the licenses described in the Content License. Java is a registered trademark of Oracle and/or its affiliates. Last updated 2020-06-24 UTC.

developer.android.com

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="com.example.daygram_clone.MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/main_list"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/colorAccent"
        android:scrollbars="vertical" />
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="80dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/colorPrimaryDark"
            android:orientation="horizontal"
            android:visibility="visible">
            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center_vertical"
                android:orientation="horizontal">
                <ImageView
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="10dp"
                    android:background="@color/colorAccent"/>

                <TextView
                    android:id="@+id/main_month"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dp"
                    android:text="August"
                    android:textSize="20dp"/>

                <TextView
                    android:id="@+id/main_year"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dp"
                    android:text="2020"
                    android:textSize="20dp"/>
            </LinearLayout>

            <TextView
                android:id="@+id/today"
                android:layout_width="40dp"
                android:layout_height="30dp"
                android:layout_gravity="center_vertical"
                android:background="@color/colorAccent"
                android:text="Today"/>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center_vertical">

                <ImageView
                    android:layout_width="80dp"
                    android:layout_height="10dp"
                    android:layout_marginLeft="30dp"
                    android:background="@color/colorAccent"/>

                <ImageView
                    android:layout_width="30dp"
                    android:layout_height="20dp"
                    android:layout_marginLeft="20dp"
                    android:background="@color/colorAccent"/>

            </LinearLayout>

        </LinearLayout>

    </FrameLayout>

</LinearLayout>


따라 하기 출처: https://codeasy.tistory.com/27

댓글