안드로이드 스튜디오 기본 위젯(Widget)을 사용한 앱 만들기 (1)


이번 글에서는 기본 위젯(Widget)을 사용한 앱을 만들어 보겠습니다!


위젯 (Widget) 은 사용자와의 상호작용을 위한 인터페이스로 제공되는 뷰(View) 오브젝트를 말합니다.

다양한 기본 위젯(Widget)이 있지만 오늘은 TextView, EditText, Button, CheckBox를 사용해서 앱을 만들어보겠습니다.



먼저 프로젝트를 Empty Activity로 생성하고 res폴더 밑에 있는activity_main.xml파일에 가면 Hello World!로 써진 화면을 볼 수 있습니다.


왼쪽 밑에 있는 Text를 클릭하면 화면을 나타내고 있는 코드를 볼 수 있는데 

Layout을 나타내는 부분에 RelativeLayout 혹은 ConstraintLayout으로 적혀 있을텐데 이부분을 LinearLayout으로 변경합니다.

만약 ContrainLayout이였다면 TextView 안에 있는 app:layout_constraint~ 부분을 모두 지워줍니다.


그리고 android:orientation="vertical" 을 주면 위젯(Widget)이 위에서 아래로 추가되는 속성을 주는데 이것을 입력합니다.



Design 탭을 눌러서 다시 화면으로 돌아와서 왼쪽에 All, 혹은 Widgets를 클릭해서 나오는 Button을 클릭하고 아래와 같이 화면에 끌어옵니다!



총 5번을 반복하면 버튼 5개가 추가된 화면을 볼 수 있습니다.



Text탭을 눌러 다시 코드 화면으로 돌아오면 Button이 5개가 추가 된 코드를 볼 수 있습니다.


android:id="@+id/button"는 각 뷰(View)마다에서 구별할 수 있도록 id를 부여한다는 뜻입니다.

android:text=""""안에 글자를 입력하면 원하는 글자를 나타낼 수 있습니다.

android:layout_margin="" 를 통해 부모와 뷰(View) 4면의 간격을 동일하게 지정할 수 있으며

각 면에 개별적인 간격을 지정하고 싶으면 android:layout_marginTop="", android:layout_marginBottom="",

android:layout_marginLeft=""android:layout_marginRight="" 를 통해 지정할 수 있습니다.


저는 뷰가 딱 붙어있는게 마음에 들지 않아 android:layout_margin=""을 사용해서 약간의 간격을 주었습니다.


<?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:orientation="vertical"
android:layout_width="match_parent"
android:layout_margin="20dp"
android:layout_height="match_parent"
tools:context="examples.com.myapplication2.MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="나의 첫번째 App"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="사과가격 계산" />

<Button
android:id="@+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="나이계산기" />

<Button
android:id="@+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="온도변환" />

<Button
android:id="@+id/button4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="레스토랑 주문" />

<Button
android:id="@+id/button5"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="계산기" />

</LinearLayout> 


5개의 Activity를 더 생성해서 MainActivity에서 버튼이 눌리면 해당하는 Activity로 이동하게 설정하였습니다.

여기서 Intent는 Activity간에 이동을 하기 위해서 사용하는 것입니다.

첫번째 인자로 현재 액티비티 정보를 주고 두번째 인자로 호출할 액티비티의 Class를 설정해줍니다.

그리고 startActivity(intent)를 해주면 두번째 인자로 넣은 액티비티가 호출됩니다.


package examples.com.myapplication2;

import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
Button b1, b2, b3, b4, b5;
Intent intent;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

init();

}

void init(){
b1 = (Button)findViewById(R.id.button);
b2 = (Button)findViewById(R.id.button2);
b3 = (Button)findViewById(R.id.button3);
b4 = (Button)findViewById(R.id.button4);
b5 = (Button)findViewById(R.id.button5);

b1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
intent = new Intent(MainActivity.this, Main2Activity.class);
startActivity(intent);
}
});

b2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
intent = new Intent(MainActivity.this, Main3Activity.class);
startActivity(intent);
}
});

b3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
intent = new Intent(MainActivity.this, Main4Activity.class);
startActivity(intent);
}
});

b4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
intent = new Intent(MainActivity.this, Main5Activity.class);
startActivity(intent);
}
});

b5.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
intent = new Intent(MainActivity.this, Main6Activity.class);
startActivity(intent);
}
});
}
}


실행화면입니다.

다음 글에서는 5개의 Activity를 작성해보겠습니다.




안드로이드 스튜디오 기본 위젯(Widget)을 사용한 앱 만들기 (2)


안드로이드 스튜디오 깃(GitHub) 연동하기


GitHub에 공유하고, 데이터를 받아오는 여러 가지 방법이 있습니다.


직접 명령어를 통해 GitHub를 사용하는 방법, GUI를 통한 방법, 안드로이드 스튜디오에서 제공하는 GitHub 공유 등 다양한 방법이 있습니다.


이 글에서는 안드로이드 스튜디오와 GitHub를 연동하는 방법을 작성하겠습니다.



새로운 프로젝트를 생성합니다.


상단 메뉴바의 오른쪽에 있는 VCS > Import into Version Control > Share Project on GitHub를 클릭합니다.





GitHub에 공유하기 위해서는 로그인을 해야 합니다. 만약 GitHub 계정이 없다면 밑에 Sign up을 클릭해서 회원가입을 합니다.

새로운 repository을 생성하는 부분인데 GitHub의 프로젝트 이름으로 나타납니다.

유로 사용자일 경우 Private 공유가 가능합니다.

GitHub에 공유하고 싶은 파일을 선택하고 OK 버튼을 클릭합니다.

아래와 같은 창이 표시될 수 있습니다. .idea/vcs.xml 파일이 추가로 생성되는데 이 파일을 업로드 해도 되고 안해도 되지만 저는 뭔가 올려아할 것 같아서 Yes를 눌렀습니다.



업로드가 완료되면 아래와 같은 창을 볼 수 있습니다.





GitHub에 들어가면 다음과 같이 프로젝트가 공유된 것을 확인 할 수 있습니다.





Push 하기



안드로이드 스튜디오 밑 부분에 있는 Version Control을 클릭하면 아래와 같은 창을 볼 수 있습니다.

Unversioned Files 아래에 있는 빨간색으로 표시되는 파일은 아직 git에 commit 할 수 없는 상태입니다.

Add를 해서 commit을 할 수 있는데 저 파일에서 마우스 오른쪽을 클릭해서 Add를 해줄 수 있습니다.


Default 아래에 있는 파일들은 Add는 되었지만 아직 commit은 안된 파일인데 마우스 오른쪽을 클릭해서 Commit Changes버튼을 클릭하면 Commit을 할 수 있습니다.





Commit할 파일들을 선택하고 Commit Message를 입력한 후에 우측하단에 있는 Commit버튼을 클릭하면 Commit이 완료됩니다.

Commit과 Push를 동시에 하고 싶으면 Commit and Push를 클릭하면 됩니다.


별도로 Push를 할 경우 VCS > Git > Push를 클릭하거나 맥에서는 Shift + command + K를 눌러주면 됩니다.



여러 건의 commit이 있다면 여러 건의 Message를 확인할 수 있습니다.

오른쪽 하단의 Push을 통해 Push가 진행됩니다.

Push가 완료되면 아래와 같은 창을 확인할 수 있습니다!


안드로이드 스튜디오 자기 이름 출력하는 앱 만들기



안드로이드 스튜디오를 실행하고 Start a new Android Studio project를 클릭합니다.

Application name은 앱의 이름을 지정합니다. 여기서 지정한 이름은 기본적으로 설치 및 실행되는 앱의 이름이 됩니다.

프로젝트 작성 중 언제든 변경할 수 있고 알파벳 대문자로 시작해야합니다. 예제에서는 "Post1"라고 했습니다.


Company domain은 개발자가 소속된 그룹이나 개발자 스스로를 식별할 수 있는 이름을 도메인 형식으로 입력하는 곳입니다.

예제에서는 "mobile.application"으로 했습니다.


Package name은 앱에 대한 고유 아이디로 사용됩니다. 앞에 입력한 "Company Domain"과 "Application name"을 조합하여 자동 생성됩니다.

안드로이드 스마트폰 또는 태블릿에서 동작하는 앱을 만들 것이므로 "Phone and Tablet"를 선택합니다.

"Phone and Table" 항목을 선택하면 "Minimum SDK"를 지정해야 합니다.  

"Minimum SDK"에서 지정하는 "API Level"은 앱이 실행될 최소의 안드로이드 버전을 의미합니다.

개발하고자 하는 앱의 요구사항이나 기능, 성능에 따라 적절히 선택해야하지만 간단한 앱을 만들 것이기 때문에 대부분 기기에서 사용가능한

API 16: Android 4.1 (Jelly Bean)을 선택하였습니다.

Empty Activity를 선택하고 Next를 클릭합니다.

프로젝트 생성의 마지막 단계로 Activity의 이름을 수정할 수 있는 화면이 표시됩니다. 

Activity Name을 수정해도 되지만 저는 그냥 finish를 클릭했습니다.

위의 사진과 동일한 Activity Name, Layout Name을 가진 프로젝트가 생성된 화면을 볼 수 있는데 res/layout폴더에 있는 activity_main.xml 파일을 더블 클릭해줍니다.

Hello World!가 출력되어 있는 화면을 볼 수 있는데 왼쪽 밑에 있는 Text를 클릭합니다.

android:text="Hello World!"의 ""사이에 출력하고 싶은 텍스트를 입력하면 작성한 텍스트로 출력이됩니다.

자기 이름 출력하는 앱 만들기이므로 Hello World!!!! 조영욱을 입력했습니다.

Design을 클릭해서 원래 화면으로 다시 돌아오면 Hello World!!!! 조영욱이 출력된 화면을 볼 수 있습니다.

만든 앱을 실행하기 위해서 안드로이드 스튜디오의 Run 'app' 메뉴를 클릭합니다.



앱을 실행할 기기 또는 에뮬레이터를 선택하는 화면이 출력되면, 기기를 선택하고 "OK" 버튼을 클릭합니다.

만약 연결되어 있는 기기 또는 에뮬레이터가 생성되어 있지 않다면 왼쪽 밑에 있는 Create New Emulator를 클릭해 새로운 에뮬레이터를

생성하고 진행합니다.

앱을 실행 후 잠시 기다리면 아래와 같이 앱이 실행된 화면이 표시되는 것을 확인할 수 있습니다!

위의 코드는  https://github.com/Ywook/Post1/blob/master/app/src/main/res/layout/activity_main.xml에서 확인할 수 있습니다!


+ Recent posts