코드 기록장

자격증 준비 때문에 잠시 중지합니다.

언제 다시 시작할지 정확하게는 말씀드리기 어렵고 초여름? 정도이지 않을까 예상합니다.

올해 가을까지는 무조건 완성할 예정이라 돌아오면 거의 매일 프로젝트를 진행하지 않을까 싶습니다.

무기한 중단되었습니다.

지금부터 당분간은 가게 등록이나 주문을 위한 사장님전용 어플을 만들겁니다.

지금 기본 어플은 화면 구성과 서브페이지까지 구현이 되는데 서브페이지에서 메뉴라던지 등록된 가게 목록을 보기 위해서 등록하는 어플이 필요합니다.

찾아보니 배달의 민족에서는 가게 등록을 위해 따로 웹 페이지를 운영하고, 앱도 따로 있는 방식이지만 저는 그냥 어플에서 회원가입, 가게 등록을 다 하도록 구현할 것입니다.

먼저 로그인 UI를 만들기 위해서 안드로이드 스튜디오에서 새 프로젝트를 만듭니다.

앞선 어플에서 보시다시피 UI보다는 기능 구현에 중점을 두기 때문에 따로 구현하지 않고 구현되어 있는 것을 사용했습니다.

(만들다보면 직접 만드는 게 구조파악이 용이해서 따로 만들게 될지는 모르겠습니다..)

구글에 안드로이드 로그인UI 구현하기는 잘 나와있으니 따로 명시하지는 않겠습니다.

그 다음 앱을 실행했을 때 로그인 화면이 먼저 뜨도록 변경해줍니다.

저 파일에서 아래 사진처럼 태그를 옮겨줍니다.

이것으로 일단은 로그인 화면 구현은 끝입니다.

저는 Spring으로 구현한다고 첫 포스팅에서 얘기했었기 때문에 이클립스에 Spring 설치 및 환경 세팅을 해야 합니다.

아래 블로그를 참고하여 세팅했습니다.

이제 Spring과 연동할, 그리고 전송할 정보를 담는 DB를 만듭니다. 저는 MariaDB를 사용했습니다.

<구조>

구조는 구현하다보면 바뀔 수도 있을 것 같습니다.

<코드>

create database BaminDB;

create table store_info(
	id int(11) not null auto_increment,
	category int(11) not null,
	name varchar(50) not null,
	menu varchar(30),
	image varchar(100),
	primary key(id));

select * from store_info;

다음 포스팅에서는 DB-Spring연동에 대한 내용입니다.

저번 포스팅에서 하단 고정 버튼과 배너를 구현하기로 했는데 실력 부족으로 배너 구현에 시간이 너무 오래 걸려(구현도 못했음...) 배너는 차후에 구현하는 걸로 미루고 일단 하단 고정 버튼만 구현했습니다 이번 프로젝트를 진행하면서(특히 배너) java는 2년만에 다시 손 대는 거라서 많이 미숙함을 느끼고 공부하면서 프로젝트를 진행해야겠다는 생각이 들었습니다.

※ 이 프로젝트는 앱 개발 경험을 쌓기 위한 프로젝트이며 절대 상업적 용도로는 사용하지 않습니다. 

저번 포스팅의  activity_main.xml에서는 스크롤뷰가 전체를 감싸고 있는 형태로 구현했습니다.

그러나 하단 고정 버튼이므로 같이 스크롤되면 안됩니다. 그래서 스크롤뷰 바깥에 코드를 작성해야 합니다.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <ScrollView
        android:id="@+id/scrollView2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="4"
                android:orientation="horizontal">


                <Button
                    android:id="@+id/btn1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="20dp"
                    android:layout_weight="2"
                    android:padding="15dp"
                    android:text="선물하기" />

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="20dp"
                    android:layout_weight="2"
                    android:padding="15dp"
                    android:text="포장/방문" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="4"
                android:orientation="horizontal">


                <Button

                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="20dp"
                    android:layout_weight="2"
                    android:padding="15dp"
                    android:text="1인분" />

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_margin="20dp"
                    android:layout_weight="2"
                    android:padding="15dp"
                    android:text="한식" />


            </LinearLayout>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="스크롤 뷰 테스트 중입니다."
                android:textSize="150dp">

            </TextView>


        </LinearLayout>


    </ScrollView>
    
    
    <!----아래부터 추가된 부분---->

    <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@id/navigationView"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"></FrameLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/navigationView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="parent"
        app:menu="@menu/bottombutton" />




</androidx.constraintlayout.widget.ConstraintLayout>

하단 버튼을 구현하려고 구글링하다보니 fragment라는 용어를 많이 쓰더라구요.

이제 메인입니다.

MainActivity.java

package com.example.badal;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentTransaction;
import androidx.viewpager.widget.ViewPager;

import android.content.Intent;
import android.os.Bundle;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;

import com.google.android.material.bottomnavigation.BottomNavigationView;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {


    // 하단 버튼 코드 ----------------------------------
    private FragmentManager fragmentManager = getSupportFragmentManager();
    private FragmentHome Fragmenthome = new FragmentHome();
    private FragmentEat Fragmenteat = new FragmentEat();
    private FragmentSelect Fragmentselect = new FragmentSelect();
    private FragmentEatList Fragmenteatlist = new FragmentEatList();
    private FragmentMyPage Fragmentmypage = new FragmentMyPage();
    //------------------------------------------------



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        Button imageButton = (Button) findViewById(R.id.btn1);
        imageButton.setOnClickListener(new View.OnClickListener() {


            //@Override
            public void onClick(View view) {
                Intent intent = new Intent(getApplicationContext(), KoreaActivity.class);
                startActivity(intent);
            }

        });





        // 하단 버튼 코드 ----------------------------------
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        transaction.replace(R.id.frameLayout, Fragmenthome).commitAllowingStateLoss(); // 여러 개 쓰면 안됨


        BottomNavigationView bottomNavigationView = findViewById(R.id.navigationView);
        bottomNavigationView.setOnNavigationItemSelectedListener(new ItemSelectedListener());

    }


    class ItemSelectedListener implements BottomNavigationView.OnNavigationItemSelectedListener{
        @Override
        public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
            FragmentTransaction transaction = fragmentManager.beginTransaction();

            switch(menuItem.getItemId())
            {
                case R.id.home:
                    transaction.replace(R.id.frameLayout, Fragmenthome).commitAllowingStateLoss();
                    // 메뉴 클릭 시 동작 코드 쓰는 곳인듯..?

                    break;

                case R.id.eat:
                    transaction.replace(R.id.frameLayout, Fragmenteat).commitAllowingStateLoss();

                    break;

                case R.id.select:
                    transaction.replace(R.id.frameLayout, Fragmentselect).commitAllowingStateLoss();

                    break;

                case R.id.eatlist:
                    transaction.replace(R.id.frameLayout, Fragmenteatlist).commitAllowingStateLoss();

                    break;

                case R.id.mypage:
                    transaction.replace(R.id.frameLayout, Fragmentmypage).commitAllowingStateLoss();

                    break;

            }
            return true;
        }
    }

    //----------------------------




}

하단 버튼 코드는 보기 편하게 영역을 구분해 놓았습니다.

하단 버튼은 navigationview로 구현하는 것 같습니다.

(구현 당시에는 하단에 뭐먹지 버튼이 있었는데 지금보니 검색 버튼으로 바뀌었길래 바로 바꿨습니다)

이제 저 메인에 들어갈 java, xml, 폴더를 만들면 됩니다.

먼저 res 밑에 폴더와 xml 파일을 하나 만듭니다. 이 xml파일 이름이 activity_main.xml에서 밑에서 두번째 줄

        app:menu="@menu/bottombutton" />

경로가 됩니다. 저는 폴더명이 menu, xml파일 명의 bottombutton입니다.

bottombutton.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">


        <item
            android:id="@+id/home"
            android:icon="@android:drawable/ic_menu_search"
            android:title="홈" />
        <item
            android:id="@+id/search"
            android:icon="@android:drawable/ic_menu_camera"
            android:title="검색" />
        <item
            android:id="@+id/select"
            android:icon="@android:drawable/ic_menu_add"
            android:title="찜한 가게" />
        <item
            android:id="@+id/eatlist"
            android:icon="@android:drawable/ic_menu_recent_history"
            android:title="주문 내역" />
        <item
            android:id="@+id/mypage"
            android:icon="@android:drawable/ic_menu_myplaces"
            android:title="My배민" />



</menu>

item이라는 태그는 처음 써봤네요. 이렇게 작성하고 나면 오른쪽에 화면이 다음과 같이 뜹니다.

이제 activity_main.xml이 있는 layout폴더에 item의 수만큼 xml파일을 만들어야 합니다.

저는 이렇게 만들었습니다. 각 xml의 코드는 모두 동일하게 아래처럼 작성했습니다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </TextView>

</androidx.constraintlayout.widget.ConstraintLayout>

아직 구현까지는 아니니까요.

이제 마지막으로 각 item에 해당하는 java파일을 만들면 됩니다.

이름은 위와 같고 코드도 layout 파일명 빼고는 모두 동일합니다.

package com.example.badal;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

public class FragmentEatList extends Fragment {

    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.bottom_eatlist, container, false);
    }
}

역시 다 틀만 잡아놓은 상태입니다.

구현 영상입니다.

하단 버튼에 대한 모든 코드는 아래 포스팅을 참고하였습니다.

lktprogrammer.tistory.com/183

※ 이 프로젝트는 앱 개발 경험을 쌓기 위한 프로젝트이며 절대 상업적 용도로는 사용하지 않습니다. 

이번 포스팅에서는 기기별 디스플레이를 고려한 레이아웃과 스크롤뷰를 적용해 화면 스크롤이 가능하도록 코드를 작성해보겠습니다.

먼저 기존 버튼의 코드를 보면

<activity_main.xml>

<!--생략-->

<Button
                android:id="@+id/btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="한식" />
                
<!--생략-->

이렇게 width, height가 wrap_content로 되어 있습니다. 글자 크기만큼을 버튼 크기로 하겠다는 뜻인데, 저는 좀 더 깔끔하게 보이기 위해 padding을 사용했습니다.

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="한식"
                android:padding="15dp"/>

padding을 사용하면 버튼 크기를 좀 더 여유있게 만들 수 있어 보기에도 더 편하다는 생각이 듭니다.

다음은 본격적으로 레이아웃 부분입니다.  

weight를 사용해서 기기별로 디스플레이의 너비가 다르더라도 버튼의 위치를 일정한 비율로 유지할 수 있도록 지정할 수 있습니다.

<activity_main.xml>

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_weight="4">


            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1인분"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:padding="15dp"/>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="한식"
                android:padding="15dp"/>



        </LinearLayout>

버튼을 감싸고 있는 LinearLayout에서(5번 줄) weight를 4라고 지정했습니다.

자식으로 볼 수 있는 Button의 코드를 보면 둘 다 layout_weight = "2" 라고 되어 있습니다.   

두 버튼이 동일한 비율로 디스플레이를 차지하겠다는 뜻입니다.

예를 들어 1인분 버튼을 1로, 한식 버튼을 3으로 지정한다면 1인분 버튼이 차지하는 비율이 더 작게됩니다. 

저는 버튼이 4개니까 다음과 같이 지정해주었습니다.

<activity_main.xml>

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">



    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_weight="4">


            <Button
                android:id="@+id/btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="선물하기"
                android:padding="15dp"/>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="포장/방문"
                android:padding="15dp"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_weight="4">


            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1인분"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:padding="15dp"/>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="한식"
                android:padding="15dp"/>


        </LinearLayout>

    </LinearLayout>


</androidx.constraintlayout.widget.ConstraintLayout>

아, 그리고 LinearLayout에서 android:layout_width="match_parent" 로 설정해주셔야 디스플레이 크기의 영향을 받지 않습니다.

무조건 디스플레이 크기만큼 레이아웃을 차지하겠다는 뜻입니다.

마지막으로, 스크롤 뷰를 적용해보겠습니다.

스크롤뷰 적용은 간단합니다. 전체 코드를 감싸주기만 하면 됩니다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">



    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="배너 공간"
            android:textSize="100dp"/>
            

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_weight="4">


            <Button
                android:id="@+id/btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="선물하기"
                android:padding="15dp"/>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="포장/방문"
                android:padding="15dp"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:layout_weight="4">


            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1인분"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:padding="15dp"/>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:layout_margin="20dp"
                android:text="한식"
                android:padding="15dp"/>


        </LinearLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="스크롤 뷰 테스트 중입니다."
            android:textSize="150dp">

        </TextView>


    </LinearLayout>



    </ScrollView>


</androidx.constraintlayout.widget.ConstraintLayout>

다음 포스팅에서 만들어볼 배너 위치를 텍스트뷰가 차지하도록 구현해놨습니다.

일반 휴대폰과 폴더블(가로가 넓은 형태) 휴대폰으로 테스트 해보았습니다. 

<일반 휴대폰> 

+동영상의 광고는 제가 붙이는 것이 아니라 카카오TV에서 붙입니다...

<폴더블 휴대폰>

두 기종 다 비율 적용이 잘 되는 것을 확인할 수 있습니다.

다음 포스팅에서는 배달의 민족 어플의 메인 화면에 있는 배너와 하단 고정 버튼을 구현해보도록 하겠습니다.

※ 이 프로젝트는 앱 개발 경험을 쌓기 위한 프로젝트이며 절대 상업적 용도로는 사용하지 않습니다. 

(+2020.01.17 수정 : 레이아웃 코드는 다음 포스팅을 참고해주세요. 코드가 깔끔하지 못합니다)

배달의민족 어플을 켜면 제일 먼저 보이는 

음식 종류 선택 버튼을 만들고 버튼을 눌렀을 때 해당 페이지로 이동하는 것까지 구현해보겠습니다.

새로운 프로젝트를 만들게되면 가장 먼저 눈에 보이는 버튼을 만드는 게 편하겠죠.

먼저 activity_main.xml에서 버튼을 생성해줍니다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="410dp"
        android:layout_height="500dp"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="230dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="410dp"
            android:layout_height="100dp"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="300dp"
            android:orientation="horizontal">


            <Button
                android:id="@+id/btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="한식" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="중식"/>

        </LinearLayout>


    </LinearLayout>




</androidx.constraintlayout.widget.ConstraintLayout>

<Button ~/>태그를 살펴보면 명령어가 직관적으로 되어있어서 이해하기 어렵지는 않습니다. 딱 보면 어떤 것을 지정해주는 지 이해하기 쉽습니다.

layout_margin은 버튼의 상하좌우 여백을 한꺼번에 동일하게 설정할 수 있습니다.

그다음 <LinearLayout ~/>에 대한 설명입니다.

여기서 제일 눈여겨 봐야 할 것은 android:orientation="vertical"과 android:orientation="horizontal"입니다.

혹시 vertical과 horizontal을 모르신다면 아래에 잘 설명되어 있는 포스팅 링크를 걸어드리겠습니다.

제 코드의 구조를 보면 vertical이 horizontal을 감싸고 있습니다. 이렇게 여러 개의 Linearlayout을 사용할 수도 있는데 이렇게 되면 버튼의 배열이 아래의 그림과 같아집니다.

지금 상태는 코드가 단순하지만 아래 코드처럼 한 겹만 더 추가하게되면

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!--
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
    -->

    <LinearLayout
        android:layout_width="410dp"
        android:layout_height="500dp"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="230dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="410dp"
            android:layout_height="100dp"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="300dp"
            android:orientation="horizontal">


            <Button
                android:id="@+id/btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="한식" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="중식"/>

        </LinearLayout>

        <LinearLayout
            android:layout_width="410dp"
            android:layout_height="100dp"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="300dp"
            android:orientation="horizontal">


            <Button

                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="한식" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:text="중식"/>

        </LinearLayout>


    </LinearLayout>




</androidx.constraintlayout.widget.ConstraintLayout>

아래 그림처럼 버튼이 배열됩니다.

제일 바깥의 초록색 칸이 앱 화면입니다. 이렇게 Linearlayout을 사용하면 버튼 등을 편리하게 배치할 수 있습니다.

여기까지 하고나면 안드로이드 스튜디오의 가상머신으로 어플을 실행했을 때 아래의 화면과 같습니다.

이제 버튼을 클릭하면 다른 페이지로 이동하도록 구현해보겠습니다. 

저는 아래의 포스팅을 참고하여 작성했습니다.

그리고 타이핑 하시다가 키워드가 빨간색이라면 무조건 Import 해주셔야 합니다. 

저는 한식 페이지를 만들었기 때문에 서브 페이지의 이름을 koreafoodpage.xml 이라고 지었습니다.

koreafoodpage.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center">
    <TextView
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="한식 페이지입니다!"
        android:textSize="35dp"

    />

    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

KoreaActivity.java

package com.example.badal;

import android.os.Bundle;

import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;

public class KoreaActivity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.koreafoodpage);
    }
}

MainActivity.java

package com.example.badal;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        Button imageButton = (Button) findViewById(R.id.btn1);
        imageButton.setOnClickListener(new View.OnClickListener() {

            //@Override
            public void onClick(View view) {
                Intent intent = new Intent(getApplicationContext(), KoreaActivity.class);
                startActivity(intent);
            }

        });
    }

}

마지막으로 Manifest 추가하는 것도 잊지 마세요.

실행하면 아래와 같습니다.

이것으로 이번 포스팅을 마치겠습니다.

안드로이드 스튜디오, 웹서버 Spring, MariaDB, AWS를 이용한 배달의 민족 만들어보기 프로젝트입니다.

제 개인 프로젝트이며 디자인은 제가 임의로 만들거라서 배민과 비슷하지 않고 기능 또한 최대한 구현해보겠지만 100% 완벽히 구현하지 않습니다. 

저는 앱 개발이 처음이라 이미 경험이 있으시거나 완벽한 개발을 원하시는 분들께는 참고를 추천드리지 않습니다. 

이 프로젝트는 앱 개발 경험을 쌓기 위한 프로젝트이며 절대 상업적 용도로는 사용하지 않습니다.