Android - layout (2)

Android 2016. 7. 21. 13:27

이번에는 기기에 사진을 넣는 예제를 하겠습니다.


사진 3장을 준비합니다.


사진이름은 소문자로만 첫글자는 영어로 띄어쓰기는 없이 해주세요.


그리고 안드로이드 프로젝트를 만들고!!!


res - drawable-hdpi 폴더에 사진을 넣어주세요!!!


그리고 layout - activity_main.xml 에서 소스작성을 해줍니다.


<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"
tools:context="${relativePackage}.${activityClass}"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:src="@drawable/a1"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="horizontal"
android:gravity="center"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="@drawable/a3"
/>
</LinearLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"
android:src="@drawable/a2"
/>
</LinearLayout>


검정색으로 표시한거는 사진이름으로 작성해주시면 됩니다.

이렇게하고 실행을 해주시면!!!



사진을 어플에서 사용하려면 사진을 res폴더 drawble에 넣어둬야하고,
사진의 이름이 사진의 식별자가 되고 식별자는 소문자나 숫자로만 이뤄져야함.
사진을 뷰로 표현하는 위젯은 ImageView이고, 원하는 사진을 src속성에 지정


이제 추가해서 스크롤까지 해보겠습니다.

<ScrollView android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="4">
</ScrollView>
xml에 추가해서
위 코드를 작성해주시고
저 코드안에 이미지뷰를 넣어주시면 스크롤이 생깁니다!!

ScrollView은 위아래 스크롤
HorizontalScrollView은 좌우 스크롤이고
스크롤안에서는 영역이 무한하기때문에 사진이 원본으로 나옵니다.


가운데 사진에 이벤트 넣기를 할게요.
버튼이 눌리면 위아래 사진이 바뀌고 버튼이 눌렸다는 토스트를 띄우는것까지
일단 토스트부터 작업하겠습니다.



버튼 이미지에 id값을 넣어주세요!!

그리고 나서 버튼을 누르면 "스왑이미지 눌림"이 나오도록

아래와같이 작성을 해주면 됩니다.






토스트가 잘나오는것이 확인됬으니 이제 사진을 바꾸겠습니다.
사진의 이미지를 바꾸기 위해 사진에도 id값을 입력해주세요.


저는 사진1을 a1img 사진2를 a2img로 id를 넣어줬습니다.





그리고나서 아이디를 findViewById까지 등록해주시고

onClick 메소드안에 소스를 작성해줍니다.

Drawable 를 사용해서 사진의 위치를 바꾸도록 하였습니다.





적용하시면 위처럼 버튼을 누를때마다 사진이 바뀝니다.








Posted by 보로로롬
,

Android - 05. Layout

Android 2016. 7. 20. 13:07

컴포지트 패턴(Composite pattern)이란 

객체들의 관계를 트리 구조로 구성하여 부분-전체 계층을 표현하는 패턴으로, 사용자가 단일 객체와 복합 객체 모두 동일하게 다루도록 한다.


Layout 구조를 가지는게 컴포지트 패턴입니다.


ViewGroup은 자신 내부에 다른 위젯을 담을수 있는 컨테이너

자바로 치면 프레임이나 패널 같은 녀석

ViewGroup은 위젯들의 부모클래스인 View를 멤버로 유지할건데 

ViewGroup자체도 View를 상속받음


ViewGroup : View을 담고있는 그릇, View을 배치하는 역할


다양한 ViewGroup ( layout )

- 리니어 레이아웃 : 박스모델, 사각형 영역들을 이용해 화면을 구성

- 상대 레이아웃 : 규칙기반 모델, 부모컨테이너나 다른 뷰와의 상대적 위치를 이용해 화면을 구성

- 프레임 레이아웃 : 기본단위 모델, 하나의 뷰만 보여줌. 가장 단순하지만 여러개의 뷰를 중첩한 후

각 뷰를 전환하여 보여주는 방식에 유리

- 테이블 레이아웃 : 격자모델, 격자 모양의 배열을 이용하여 화면을 구성

- 스크롤 뷰 : 스크롤이 가능한 컨테이너 뷰 또는 뷰그룹이 내부에 담아서 화면영역이 넘어갈때 스크롤 기능제공



단위 dp sp px;


orientation타입

horizontal : 가로로 배치

vertical : 세로로 배치


부모가 horizontal 이고

weight를 모두 1로주면 가로너비를 1:1:1로 나눠먹음




<코드>

<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"
tools:context="${relativePackage}.${activityClass}"
android:orientation="horizontal"> <!-- 가로로 배치 -->
<!-- android:orientation="vertical"> --> <!-- 세로로 배치 -->
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="btn1"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="btn2"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="btn3"
/>
</LinearLayout>



weight를 3:1:1줬을때
















3:1:1인데 딱히 3:1:1처럼 보이지않음
많은경우에서 정확하게 비율을 나눠주지 못함 (우선순위에 밀려서) 아주 뭉뚱구려 넉넉하게 비율이 나눠지는 상황에 사용


가로타입을 : match_parent으로 줬을때

















weitgh를 안줬을때는 가로너비를 btn1이 다먹어서 2번3번이 올곳이 없음
















세로타입을 : match_parent으로 줬을때


위아래를 전부다 차지





gravity는 레이아웃내에서 위중간아래로 위치를 잡아줄수있음



버튼안에 있는 텍스트도 버튼안에 gravity를 줘서 위치를 잡아줄수 있고

"bottom|center" 중간에 |(or)을 줘서 위치를 잡아줄수 있다.
















Posted by 보로로롬
,

Context 역할

-어플리케이션에 관하여 시스템이 관리하고 있는 정보에 접근하기

-안드로이드 시스템서비스에서 제공하는 api를 호출 할 수 있는 기능


저번에 나이를 입력하는 예제를 만들었던 거에 추가해서

토스트를 띄우는 것과 체크박스를 체크하는 예제를 해보겠습니다.


일단 layout폴더에 있는 activity_main.xml에 

저번에 쓴거 아래에 토스트를 띄울 버튼과 체크박스 2개를 추가해주세요.


<Button
android:id="@+id/toast_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="토스트 띄우기" />
<CheckBox
android:id="@+id/chk1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="체크박스1"
/>
<CheckBox
android:id="@+id/chk2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="체크박스2"
/>


그리고 MainActivity.java 에 추가적으로 이벤트등을 등록해주세요.
바뀐부분은 빨강으로 표시했습니다.
설명은 주석으로 써놨습니다.


package kr.mulcam.c902.hui.p0719;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.CompoundButton.OnCheckedChangeListener;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends Activity {
private EditText inputAge;
private Button btn;
private TextView result;
private Button toastBtn;
private CheckBox chk1;
private CheckBox chk2;
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toast.makeText(getApplicationContext(), "이것이 토스트",1).show();
// 토스트가 뜨도록 show로 보여주는 코드입니다.
// this:토스트가 만들어질 컨텍스트 , 1:토스트가 떠있는 시간 길/짧 1/0
inputAge = (EditText) findViewById(R.id.num);
btn = (Button) findViewById(R.id.btn);
result = (TextView) findViewById(R.id.age);
toastBtn = (Button) findViewById(R.id.toast_btn);
chk1 = (CheckBox) findViewById(R.id.chk1);
chk2 = (CheckBox) findViewById(R.id.chk2);
//id값들은 신중하게 잘 지어야됨 모든 xml파일에서 하나의 id 네임스페이스를 사용함
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
String age = inputAge.getText().toString();
result.setText("당신은 " + age + "살 이시군요");
inputAge.setText("");
}
});
toastBtn.setOnClickListener(new View.OnClickListener() {
// OnClickListener를 사용해서 클릭할때마다 이벤트를 적용해줍니다.
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this, "토스트가 떠염", 1).show(); //이자리에 this:이벤트처리 (onClickListener객체 컨텍스트x)
} //getApplicationContext() : 메인엑티비티가 멤버함수로 (상속받아서) 가지고 있는 저 함수를 불러서 컨텍스트 객체를 받아오던가
}); //MainActivity.this 이벤트처리 객체를 가리키는 this가 아닌 엑티비티를 가리키는 this
chk1.setOnCheckedChangeListener(new OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this , buttonView.getText().toString()
+"가 " + (isChecked ? "선택":"해제") +
"되었습니다.", 0).show();
if(isChecked){
chk2.setChecked(false); // 이 코드는 체크박스 1개가 선택되면 다른 1개는 해제되게하는 코드입니다.
}
}
});
chk2.setOnCheckedChangeListener(new OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this , buttonView.getText().toString()
+"가 " + (isChecked ? "선택":"해제") +
"되었습니다.", 0).show();
if(isChecked){
chk1.setChecked(false); // 이 코드도 체크박스 1개가 선택되면 다른 1개는 해제되게하는 코드입니다.
}
}
});
}
}





위사진에서 볼수있듯이 버튼을 누르면 아래 토스트가 뜹니다!!







위에는 체크박스를 누를때마다 토스트가뜨는데..

컴퓨터가 너무느려서 체크박스2토스트가 뜨기전에 캡쳐를 했네요..







Posted by 보로로롬
,

액티비티 만들기

1. 액티비티를 상속받는 자바클래스 작성

2. Manifest에 액티비티를 등록

3. 액티비티가 사용할 레이아웃xml파일 작성(옵션)

4. 1의 onCreate메소드에서 3파일을 뷰로 연결



안드로이드 프로젝트를 만들어주세요!

어플리케이션 패키지명은 꼭 다르게 지정해줘야됩니다. 

안드로이드 최소 버전은 4.0 (아이스크림샌드위치) 최대 4.4 (킷캣) 으로 만들어 줬습니다.


그리고 이제 src에서 MainActivity java클래스를 만들어줍니다.

src에 액티비티가 속한 패키지명도 어플리케이션 패키지명과 동일하게 바꿔줍니다.


액티비티가 속한 패키지명과 어플리케이션 패키지명이 동일하면 좋은점!

1. R.java랑 같은 패키지에 위치해서 R클래스를 따로 임포트 해주지 않아도 됨

2. Manifest에 액티비티 등록할때 패키지명 생략가능

3. 1,2는 패키지 구조 복잡도가 올라가면 다시 분리되겠지만 코드관리를 위해서..



gen - 어플리케이션 패키지명 - R.java

R.java -> 안드로이드에서 사용하는 자우너들을 자바코드에서 참조할 수 있도록 참조값을 갖는 연결고리


R.java는 어플리케이션의 패키지명으로 지정된 패키지 경로에 자동생성됨 

( 자원 등록 중 에러가 발생하면 생성되지 않음 )

R.java 가 없으면 다른파일들에서 문제가 생기는건데 잘 처리해주시고 프로젝트 클린을 해주면 이상이없으면 자동으로 생깁니다.


그리고 이제 MainActivity java클래스에서 extends Activity를 상속받아 줍니다.


import android.app.Activity;
public class MainActivity extends Activity{
}


그다음은
AndroidManifest.xml 에가서 <application> 안에 <activity> </activity> 등록
<action>, <category>ㅁ 등록



<activity>태그는 필수로 name속성을 가져야하고 name속성의 값에서 사용할 자바 클래스 파일(Activity를 상속받은)을 지정해야됨 액티비티는 어플리케이션의 구성요소이자 하나의 화면단위이고 명령처리흐름을 갖음 어플리케이션은 최소하나의 메인액티비티를 가져야하고 메인 액티비티가 되는녀석은 Intent-filter에 메인속성과 런쳐속성을 가져야됨


res - layout 에서 new - others - Android XML Layout File 을 만들어주세요.

File명은 activity_main (관례적으로 이렇게 많이만든다고합니다.) 로 만들어주세요.

LinearLayout 으로 설정해주고 Finish 해주세요.


LinearLayout은 android:orientation="vertical"을 꼭 가짐 ( 수직인지 수평인지 )




그다음은 activity_main.xml 에서 <LinearLayout>안에 아래와같이 <TextView> 등록





그리고 <Button> 도 등록해주고 android:id="@+id/btn" 이렇게 등록







그리고 나서 다시 MainActivity.java 로 돌아와서

onCreate를 override해줍시다!!

그리고 xml에 정의한 UI 위젯의 참조값을 얻어줍니다.

btn = (Button) findViewByID(R,id.btn) <- 참조값 얻는 코드


그리고 아래와같이 작성해주세요!






그리고 실행하시면



이렇게 안드로이드 지니모션에서 이런 창이뜹니다!!




-----------------------------------------------------------------------------------------------------------


이걸 응용해서 숫자를 입력받아 형변환하는 예제





activity_main.xml 에서 설정을 해주시고!!








Main액티비티 자바 파일에서 위와같이 작성해주시고 실행하면!!







위와같이 나이를 입력하고 버튼을 누르면 버튼아래 저렇게 나옵니다!!







Posted by 보로로롬
,

pc로 안드로이드앱을 실행하려면

지니모션 / 블루스택 등등을 깔아서 사용하시면되는데

저는 지니모션을 깔도록 하겠습니다!!

https://www.genymotion.com 

위에 지니모션 홈페이지에서 다운로드를 받아서 설치를하시면됩니다!!!

설치를 하려면 가입을 해야되네요!! 

지니모션을 설치하고 사용하려면 아이디가 필요하므로 가입을 미리 해둡시다!


맥북에서는 

www.virtualbox.org 이것도 설치해야된다고 하네요!



설치완료후!




이 아이콘을 실행해줍니다.






로그인도 해주시구요~


그다음은 원하시는 기기 모델을 설정해주셔서 계속 진행하시면 됩니다!!





이창이 뜨면 안드로이드가 잘실행 되는겁니다!!

그리고 이제 테스트를 해봐야되기때문에!!!

앞에서 이클립스에서 Hello World! 프로젝트를 Run! 합시다!!


모르시겠다면 앞에글 참조!

http://borororom.tistory.com/34







Run을 하시면 지니모션에 이렇게 Hello world! 창이 띄워집니다!!!

'Android' 카테고리의 다른 글

Android - layout (2)  (0) 2016.07.21
Android - 05. Layout  (0) 2016.07.20
Android - 04. 토스트 띄우기와 체크박스  (0) 2016.07.20
Android - 03. 액티비티 만들기  (0) 2016.07.19
Android - 01. 안드로이드 개발환경 구축하기  (0) 2016.07.18
Posted by 보로로롬
,

안드로이드 개발환경 구축하기

https://developer.android.com/studio/index.html



-JDK 설치

-Android SDK(안드로이드 개발 라이브러리 준비)

 -> SDK Manager프로그램을 통해 다운로드 할 수 있음

-IDE(통합개발환경) 설치 ( 안드로이드 스튜디오, 이클립스 )

-테스트 실행환경준비 ( 기본 가상머신, 지니모션, 블루스택, 진짜 핸드폰 등등)


통합개발환경을 이클립스를 사용하는 경우에는

SDK와 이클립스간 연동과 각종 안드로이드 문법 인식을 위해

플러그인 (안드로이드ADT)를 설치해줘야 됩니다.


안드로이드 스튜디오는 인텔리제이를 기반으로 구글에서

안드로이드 전용 개발툴로 배포중입니다.





안드로이드 프로젝트를 설정해주세요!






Package Name이 같은 어플 두개는 같은폰에 설치가 되지않아서

유일한 Package Name으로 작성을해야 마켓에도 런칭이 가능합니다. 



버전별 사용자수 (단위:%)



Minimum Reauired SDK : 어플이 지원하는 최소버전

Target SDK : 어플이 지원하는 최적버전





Create custom launcher icon : 설치된 어플아이콘 만들건지 선택






Actiovity는 안드로이드 어플리케이션의 구성요소(주요한)로써

하나의 화면단위 이기도하고 명령처리흐름이기도 합니다.


Actiovity Name : Actiovity 명령흐름이 실행할 코드가 작성될 클래스 파일명

Layout Name : Actiovity 화면이 그려진 UI xml파일 명


Finish해서 만들어주세요!




이렇게 완료된 모습입니다.


AndroidManifest.xml : 우리 어플에 대한 전반적인 설정파일 (어플리케이션 구성요소 등록, 권한정보 등...)




<uses-sdk>  

->  어플리케이션 동작 최소 OS버전과 최적버전


<activity>  

->  액티비티를 구성요소로 등록

android:name=".MainActivity"  

-> 액티비티가 사용할 클래스 (풀패키지명) *.은 어플 패키지명을 뜻함

-> 맨앞이 .이면 위에서 3번째줄 "kr.mulcam.c902.hui.helloworld" 부터 시작함 


<action android:name="android.intent.action.MAIN" />  

<category android:name="android.intent.category.LAUNCHER" /> 

->  이 액티비티가 어플의 메인이고 실행되면 최초로 동작할 녀석이라는 의미

          



화면 좌측에 res폴더 : (자원폴더) 어플에서 사용할 상수문자열, 그림, 음악 등등 데이터를 여기에 배치합니다.




res - values -strings.xml   여기에 상수들은 res에 등록해놓고 사용하기를 권장


strings_ko.mxl

strings_en.xml

이런식으로 언어별 문자열 상수들을 여러개 등록하고


ko버전의 app_name에는 안녕친구야

en버전의 app_name에는 HelloBro

라고 해두면 실행되는 환경의 언어설정에 맞는 문자열이 사용됨



res - layout - activity_main.xml


Layout태그는 UI의 컨테이너 태그 (자바의 패널이나 프레임같은 친구)

<TextView> 

-> 화면 구성요소 중 자바로 치면 레이블, HTML로 치면 input타입 텍스트 리드온니 에 해당하는 요소

    안드로이드에서는 위젯




src - kr.mulcam패키지 - MainActivity.java




onCreate함수 

->액티비티가 만들어질때 호출되는 함수


setContentView(R.layout.activity_main);

-> Resoutce중 layout에 있는 activity main을 이 액티비티화면에 사용




drawable = rcs폴더에 drawable 이고 아래 0x7f020000은 자원들이 할당받을 메모리주소

layout = rec폴더에 layout




Posted by 보로로롬
,