[2021모각코] 1회차 2021.07.07

Android Studio를 이용하여 Naver검색 어플리케이션을 개발하자!

 

1회차 모각표 목표

 

기본적인 Android Studio 사용법 학습 및 검색 앱 UI설계

 

 

sinheeseung/2021-Summer-Assemble-And-Selfcode (github.com)

sinheeseung/2021-Summer-Assemble-And-Selfcode

 

<RelativeLayout 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"
    android:orientation="horizontal"
    tools:context=".MainActivity">


    <RelativeLayout
        android:id="@+id/Layer1"
        android:layout_width="match_parent"
        android:layout_height="25dp"
        android:layout_marginTop="1dp">

        <Spinner
            android:id="@+id/ComboBoxItem1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/Layer2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Layer1"
        android:layout_marginTop="1dp">

        <EditText
            android:id="@+id/EditBox1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/Layer3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Layer2"
        android:layout_marginTop="10dp">

        <ListView
            android:id="@+id/ListViewItem"
            android:layout_width="match_parent"
            android:layout_height="350dp" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/Layer4"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Layer3"

        android:layout_marginTop="10dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:layout_alignParentStart="true"
            android:orientation="horizontal">

            <Button
                android:id="@+id/Button_Prev"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:id="@+id/Button_Next"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
        </LinearLayout>
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/Layer4"
        android:layout_marginTop="5dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:layout_alignParentStart="true"
            android:orientation="horizontal">

            <Button
                android:id="@+id/Button_Search"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1" />

            <Button
                android:id="@+id/Button_Exit"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1" />
        </LinearLayout>
    </RelativeLayout>

</RelativeLayout>

RelativeLayout을 통해 Layout간의 배치를 해주었습니다.

검색어 입력받는 부분은 Editbox로, 검색 결과 부분은 ListView로, 검색/끝내기/페이지 이동 버튼은 Button으로 만들어 주었습니다.

 

package com.example.naversearch;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Spinner;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {
    private EditText EditText1;
    private Spinner ComboBox;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initComboBox();

        initEditBox();

        initButton();
    }
    private void initEditBox() {
        EditText1 = (EditText) findViewById(R.id.EditBox1);
    }
    private void initComboBox() {
        ComboBox = (Spinner) findViewById(R.id.ComboBoxItem1);
        ArrayList<String> itemList = new ArrayList<>(4);
        itemList.add("web");
        itemList.add("blog");
        itemList.add("cafe");
        itemList.add("book");
        ArrayAdapter ComboBoxArrayAdapter = new ArrayAdapter(this, android.R.layout.simple_spinner_item, itemList);
        ComboBox.setAdapter(ComboBoxArrayAdapter);

    }
    private void initButton() {
        /* 검색버튼 생성*/
        Button Button_Search = (Button) findViewById(R.id.Button_Search);
        Button_Search.setOnClickListener(mOnClickListener);
        Button_Search.setText("검색");
        /* 끝내기버튼 생성 */
        Button Button_Exit = (Button) findViewById(R.id.Button_Exit);
        Button_Exit.setOnClickListener(mOnClickListener);
        Button_Exit.setText("끝내기");
        /* 이전 페이지 버튼 생성*/
        Button Button_Prev = (Button) findViewById(R.id.Button_Prev);
        Button_Prev.setOnClickListener(mOnClickListener);
        Button_Prev.setText("이전 페이지");
        /* 다음 페이지 버튼 생성*/
        Button Button_Next = (Button) findViewById(R.id.Button_Next);
        Button_Next.setOnClickListener(mOnClickListener);
        Button_Next.setText("다음 페이지");
    }
    private final View.OnClickListener mOnClickListener = new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            switch (v.getId()) {
                case R.id.Button_Search:
                    //검색버튼 클릭 => 검색어와 검색유형 읽어옴
                    String type = ComboBox.getSelectedItem().toString();
                    String query = EditText1.getText().toString();

                case R.id.Button_Exit:
                    finish();
                    break;
            }
        }
    };

}

ComboBox, EditBox, Button을 생성해 주었습니다. Button에서는 클릭 시 동작이 있어야 하기 때문에 틀만 잡아 놓았습니다. 

네이버 검색 어플 Ui 초안입니다. API를 이용해 네이버에서 검색 정보를 가져오려고 구상 중 입니다.

네이버 검색은 검색 유형에 따라 접근법이 다르기 때문에 검색 유형을 나누어 검색 결과를 출력하려고 합니다. 

페이지 이동 버튼과 검색, 끝내기 버튼을 만들어 주었습니다.