제 2 강 프로젝트 구성과 View 안드로이드 앱 개발 강좌. 목 차목 차목 차목 차 목 차목 차목 차목 차 안드로이드 프로젝트 구성 2 에뮬레이터 사용법 3 버전과 screen size 4 5 Hello World 앱 작성하기 1 View 와 ViewGroup.

Presentation on theme: "제 2 강 프로젝트 구성과 View 안드로이드 앱 개발 강좌. 목 차목 차목 차목 차 목 차목 차목 차목 차 안드로이드 프로젝트 구성 2 에뮬레이터 사용법 3 버전과 screen size 4 5 Hello World 앱 작성하기 1 View 와 ViewGroup."— Presentation transcript:

1 제 2 강 프로젝트 구성과 View 안드로이드 앱 개발 강좌

2 목 차목 차목 차목 차 목 차목 차목 차목 차 안드로이드 프로젝트 구성 2 에뮬레이터 사용법 3 버전과 screen size 4 5 Hello World 앱 작성하기 1 View 와 ViewGroup

3 1. Hello World 앱 작성하기

4 (1) File > New > Android Project (2) 프로젝트 생성 #1

5 1.Hello World 앱 작성하기 프로젝트 생성 #2 프로젝트 생성 #3 Application Name 응용프로그램 자체의 이름 HelloWorld 로 입력 Project Name 프로젝트 이름 입력 이클립스의 Project Explorer 에서 프로젝트 식별 명칭으로 사용 여기서는 HelloWorld 사용 Package Name 프로젝트 생성 클래스가 저장될 패키지 이 름, 클래스파일 저장될 폴더 경로 패키지명은 고유해야함 유일한 패키지를 사용해야만 구글 플레이 에 업로드 가능

6 1.Hello World 앱 작성하기 (3) Configure Project - 프로젝트 관련 기본 정보들 설정 - 특별한 이유가 아니면 체크박스 수정은 않는 것을 권장 Create custom launcher icon 사용자 정의 아이콘을 사용할지 여부 설정 체크박스 Create activity 프로젝트의 액티비티 생성 여부 선택 Mark this project as a library 프로젝트를 라이브러리로 만들어 사용할 때 체크 Create Project in Workspace 프로젝트 소스를 이클립스 workspace 에 생 성하는지 여부 옵션 체크 해제시에는 원하는 위치 프로젝트 생 성 가능

7 1.Hello World 앱 작성하기 (4) Configure Launcher Icon - 사용자 정의 홈 아이콘 쉽게 만들게 한 설정화면 Foreground 홈 화면에서 보이는 launcher 아이콘을 선 택하는 화면 Image : 별도의 이미지 선택 Text : 문자를 아이콘으로 사용 clipart : 안드로이드 제공 클립아트 중 선택 shape 아이콘 배경이 되는 부분 설정 none 배경이 투명 Square 사각형 Circle 원형

8 1.Hello World 앱 작성하기 (5) Create Activity (6) New Blank Activity

9 1.Hello World 앱 작성하기 (6) New Blank Activity Create custom launcher icon 사용자 정의 아이콘을 사용할지 여부 설정 체크박스 Create activity 프로젝트의 액티비티 생성 여부 선택 Mark this project as a library 프로젝트를 라이브러리로 만들어 사용할 때 체크 Create Project in Workspace 프로젝트 소스를 이클립스 workspace 에 생 성하는지 여부 옵션 체크 해제시에는 원하는 위치 프로젝트 생 성 가능

10 1.Hello World 앱 작성하기

11 2. 안드로이드 프로젝트 구성

12 2. 안드로이드 프로젝트 구성 - 폴더 폴더 이름설명폴더의 파일들 src 안드로이드 코드를 작성하는 부분. ProjectActivity.java gen res 에서 내부적으로 생성한 컴포넌트 ( 버튼, 뷰, 체크박스 등...) 에 대한 리소스 주소를 상수화하여 자동 빌드해주며 코드상에서 컴포넌트들에 대한 접근을 쉽게 하기 위한 목적으로 존재하는 파일 R.java assets res 에 의해 참조하는 곳이 아닌 절대경로를 통하여 또다른 리소스를 참조 폴더 보통 오디오, 동영상, 웹 컨텐츠들을 저장 외부 db 파일 등 … res 이미지, 레이아웃, 스트링 등의 정적 개체들이 저장 Drawable : 이미지 저장 Layout : view, 화면구성부분 Values : string 등,color,anim, raw, menu 등의 폴더를 추가로 등록 지정 가능 icon.png main.xml strings.xml

13 2. 안드로이드 프로젝트 구성 - 파일 파일 이름경로설명 ProjectActivity.java@src 프로젝트의 최초 액티비티를 나타내는 파일입니다. 액티비티는 간단히 말씀드리자면 앱이 사용자에게 보여주는 화면이라고 보시면 됩니다. 보다 자세한 내용은 별도로 작성 예정입니다. R.java@gen R.java 파일은 프로젝트를 빌드할 때 생성되며, 클래스 R 을 정의합니다. 이 클래스는 attr, drawable, layout, string 이라는 내부 클래스를 추가로 정의합니다. 이들 안에 프로젝트와 관계된 리소스들의 ID 들이 정의됩니다. icon.png @res/drawable-hdpi @res/drawable-ldpi @res/drawable-mdpi 프로젝트로 빌드한 앱의 아이콘 파일입니다. 기기에 다운로드 된 앱의 그것은 안드로이드의 메뉴에서 보실 수 있습니다. 이 파일은 drawable- hdpi, drawable-ldpi, drawable-mdpi 폴더에 다른 크기로 저장되어 있습니다. 어떤 파일이 사용되는지는 안드로이드 기기의 해상도와 화면의 크기에 따라 다릅니다. main.xml@res/layout 프로젝트의 최초 액티비티가 어떤 객체들을 갖는지를 정의하는 파일입니다. 초기 프로젝트에서 이 파일은 LinearLayout 객체, TextView 객체가 정의되어 있습니다. strings.xml@res/values 프로젝트와 관계된 문구들이 정의되어 있습니다. 초기 프로젝트에는 앱의 이름, 인사말이 이 파일 안에 있습니다. AndroidManifest.xml@ AndroidManifest.xml 은 만들고자 하는 앱에 대한 정보와 설정들을 담는 파일입니다. 초기에 이 파일에 담겨있는 정보들은 패키지, 버전, 아이콘, 앱의 이름, 액티비티 관련 값들 등입니다.

14 2. 안드로이드 프로젝트 구성 안드로이드의 빌드 프로세스 javac Class dx Class.dex apkbui lder APK appt Class

15 2. 안드로이드 프로젝트 구성 매니페스트 구성 텝 설명 Manifest 프로젝트의 패키지, 버전등의 전반적인 정보 Application 애플리케이션에서 사용하는 이름, 아이콘등과 액티비티의 추가를 할 수 있음 Permission s 애플리케이션이 사용하는 권한 신청 너무 많은 권한을 요구하면 사용자가 외면할 수 있음 반드시 필요한 권한만 설정 Instrument ation 테스트를 위해 제공하는 Instrumentation 프레임 워크에 관한 설정 AndroidMa nifest.xml 다른 탭에서 GUI 환경으로 제공하는 것을 일반 Xml 로 수정

16 3. 에뮬레이터 사용법

17 3. 애뮬레이터 사용법 1) Window - Android Virtual Device Manager 를 클릭

18 3. 애뮬레이터 사용법 2) New 버튼을 눌러서 새로운 안드로이드 기계를 만듬 3) 새로운 안드로이드 기계를 만드는 과정

19 3. 애뮬레이터 사용법 3) 새로운 안드로이드 기계를 만드는 과정 이름용도 AVD Name 안드로이드 버츄얼 디바이스 이름 원하는 이름 (myavd) Device 해상도 설정 무난한 4 인치 디스플레이 해 상도로 선택 Memory Options 휴대폰 메모리의 양 설정 Interneal Storage 휴대폰 내장메모리 사이즈 설정 Target 어떤 버전으로 올릴지를 선 택 4) 만든 AVD 를 선택하신후 Start

20 3. 애뮬레이터 사용법 5) Scale display to real size : 말그대로 실제사이즈로 실행시키는지 를 정하는 체크박스 작게 떠서 좀더 빨리 뜬다고 보면 됨 6) 안드로이드 에뮬레이터 기동중

21 3. 애뮬레이터 사용법 7) 안드로이드 부팅중 핸드폰 전원켜는 중 8) Avd 실행

22 4. 버전과 screen size

23 4. 버전 참고사이트 : http://ko.wikipedia.org/wiki/%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C_%EB%B2%84%EC%A0%84_ %EC%97%AD%EC%82%AC

24 4.Screen Size 마 ) 안드로이드에서 사용하는 화면 관련 용어 ① 화면크기 (Screen Size) : 화면의 물리적인 크기 의미 - 대각선의 길이로 표기 - 4 인치, 3.5 인치 처럼 주로 인치 단위를 사용 - 대 (large), 중 (normal), 소 (small), 초대형 (xlarge) 로 분류 - 초대형 (xlarge) : 2.3 이후부터 7 인치 초과의 크기를 분류, 갤럭시노트 2 도 여기 해당 ② 종횡비 (Aspect ratio) : 가로와 세로 길이의 비율 - 4:3 16:9 등의 비율로 표기하는 것이 일반적 - Long, notlong 분류 - 호환성 확보와는 크게 상관없음 ③ 화소수 / 해상도 (Resolution) : 화면을 구성하는 점의 개수 - 240 * 320, 480 * 800, 720 * 1280 식으로 가로 * 세로로 표기 - 안드로이드는 항상 가로를 먼저 칭함 - 화소수에 상관없이 배치해야 하므로 레이아웃에서는 이 값을 직접 참조하지 않음 ④ 밀도 (Density) : 일정 길이 안에 점이 몇 개나 있는지를 나타냄. - 보통 인치당 점의 개수인 dpi 로 표기 - 이 값이 높을수록 좁은 면적에 많은 정보를 보여줄 수 있음 - 밀도에 따라 UI 의 실제 길이가 결정되므로 실질적으로 가장 중요한 정보 - 초고밀도 (xhdpi: 320), 고 (high: 240), 중 (medium : 160), 저 (low : 120) 로 분류 -(http://blog.daum.net/dayhyub/65)

25 4.Screen Size Total ldpimdpitvdpihdpixhdpixxhdpiTotal Small9.2% Normal0.1%15.1%33.4%22.2%8.8%79.6% Large0.6%3.6%1.2%0.5% 6.4% Xlarge4.4%0.3%0.1%4.8% Total9.9%23.1%1.2%34.2%22.8%8.8% http://developer.android.com/about/dashboards/index.html

26 4.Screen Size http://developer.android.com/guide/practices/screens_support.html Low density (120), ldpi Medium density (1 60), mdpi High density (240), hdpi Extra high density (320), xhdpi SmallscreenQVGA (240x320)480x640 NormalscreenWQVGA400 (240 x400) WQVGA432 (240 x432) HVGA (320x480)WVGA800 (480x8 00) WVGA854 (480x8 54) 600x1024 640x960 LargescreenWVGA800** (480 x800) WVGA854** (480 x854) WVGA800* (480x 800) WVGA854* (480x 854) 600x1024 Extra Largescreen1024x600WXGA (1280x800 ) † 1024x768 1280x768 1536x1152 1920x1152 1920x1200 2048x1536 2560x1536 2560x1600

27 5. View 와 ViewGroup

28

29

30 5. View 와 ViewGroup – View 의 속성 - 1) 아이디 - 뷰 객체는 한 개의 정수형의 아이디 (android:id) 만 가짐 - 이 아이디는 xml 레이아웃파일에 정의 <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:layout_marginLeft="31dp" android:layout_marginTop="48dp" android:text="Button" /> -@ 기호의 의미는 ID 를 리소스에 정의하거나 참조한다는 뜻 -@ 기회를 빠뜨리지 않도록 주의하자 ! -+ 기호는 신규로 ID 를 정의한다는 의미 Button mb1 = (Button) findViewById(R.id.button1); 2) Position ① 크기 (size) : 뷰의 폭 (width) 과 높이 (Height) ② padding : 뷰와 뷰안의 콘텐트 사이 간격을 지정하는 값 ③ margin : 뷰그룹의 속성, 부모뷰와 자식뷰간의 거리 android:paddingBottom="2dp" android:paddingLeft="2dp" android:paddingRight="2dp" android:paddingTop="2dp“ 소스코드 : setPadding(int,int,, int,int);

31 5. View 와 ViewGroup – View 의 속성 - 3) 뷰크기 설정 방법 - 구체적인 숫자로 전단하는 방법 -MATCH_PARENT : 부모뷰의 크기만큼 다 채움 -WRAP_CONTENT : 뷰가 가진 콘텐트의 크기에 맞게 뷰의 크기 조정 4) 이벤트 처리 - 받은 이벤트는 이벤트 리스너에 전달 -onClick(), onLongClick(), onKey() 등 다양한 이벤트 5) 안드로이드 화면 크기 단위 종류 단위의미 px 화면의 실제 픽셀 dp,dip Density-Independent Pixels 약자 240dp 이면 해상도의 1/240 이 1 픽셀 의미 In 인치 Mm 밀리미터 Sp Scale_Independent Pixels 의 약자 Dp 와 유사한 개념 주로 폰트에 사용

32 5. View 와 ViewGroup – 기본위젯 - 1)TextView -View 클래스에서 파생된 클래스 - 텍스트를 표시하는 것 -Button 클래스와 에디트텍스트 클랙스의 부모 클래스 [ 속성 ] -textSize -textStyle : bold,italic,normal -Text : 출력될 텍스트 문자열 지칭속성 -textColor -Layout_width,layout_height -singleLine : 문자열이 위젯 크기보다 클 경우 강제로 한줄로 맞추는 속성 3) 스크롤 뷰 (scroll view) - 주로 화면에 내용이 많은 경우에 이를 화면에 벗어나서 표시할 수 없을 때 스크롤을 이용해 화면에 내용 출력 4) 버튼 - 클릭이벤트에 반응해 사용자 요청을 처리하는 위젯 - 이미지버튼 : 이미지를 버튼에 삽입하면 - 체크박스 : 체크됐는지, 안 됐는지의 두가지 상태를 가진 특별한 타입의 버튼 - 라디오버튼 : 라디오 그룹에 묶여있는 라디오는 한 개만 선택 - 토글버튼 : 채크박스와 유사하며 텍스트 변경 2) ImageView -Png, jpeg,gif,bitmap 같은 다양한 이미지 소스로부터 이미지를 화면에 출력하는 뷰 객체 [ 속성 ] -Src : 화면에 출력할 이미지의 아이디를 지정하는 속성 예 ) res/drawable-ldpi/ic_launch.png android:src = “@ic_launch” -scaleType : ImageView 의 크기에 맞게 이미지 크기를 조정 하거나 움직이게 하는 속성 -maxWidth,maxHeight : 이미지가 이미지뷰에 붙여질 때의 최대 크기 -adjustViewBounds : 이미지 크기의 가로세로비율에 맞게 이미지 뷰의 크기 조정여부 -cropToPadding: 패딩을 맞추기위해 이미지 일부를 잘라낼 지 여부 -Tint : 이미지에 틴트 컬러입히는속성

33 5. View 와 ViewGroup – 기본위젯 - <RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".TestActivity" > <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:layout_marginLeft="31dp" android:layout_marginTop="48dp" android:paddingBottom="2dp" android:paddingLeft="2dp" android:paddingRight="2dp" android:paddingTop="2dp" android:text=" 확인 " /> <CheckBox android:id="@+id/checkBox1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/button1" android:layout_below="@+id/button1" android:layout_marginTop="24dp" android:text=" 아이폰 " /> <CheckBox android:id="@+id/checkBox2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/checkBox1" android:layout_below="@+id/checkBox1" android:text=" 안드로이드 " /> <CheckBox android:id="@+id/checkBox3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/checkBox2" android:layout_below="@+id/checkBox2" android:text=" 베가 " /> <RadioGroup android:id="@+id/radioGroup1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/checkBox3" android:layout_below="@+id/checkBox3" android:layout_marginTop="1dp" > <RadioButton android:id="@+id/radioButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="1dp" android:text=" 직원 " /> <RadioButton android:id="@+id/radioButton2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignLeft="@+id/radioButton1" android:layout_below="@+id/radioButton1" android:text=" 협력직원 " /> <ToggleButton android:id="@+id/toggleButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignRight="@+id/checkBox1" android:layout_below="@+id/radioGroup1" android:layout_marginTop="17dp" android:text="ToggleButton" android:textOff=" 커짐 " android:textOn=" 켜짐 " />