Presentation is loading. Please wait.

Presentation is loading. Please wait.

전광판 만들기 UNIT 04 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Layout XML 이란 ? 기본 XML 속성 Text View 2.

Similar presentations


Presentation on theme: "전광판 만들기 UNIT 04 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Layout XML 이란 ? 기본 XML 속성 Text View 2."— Presentation transcript:

1 전광판 만들기 UNIT 04 로봇 SW 콘텐츠 교육원 조용수

2 학습 목표 Layout XML 이란 ? 기본 XML 속성 Text View 2

3 Layout XML 이란 ? UI 구성요소를 정의 View or ViewGroup 으로 구성 다양한 Device 상황에 맞춰서 xml 작성 가능 3

4 액티비티와 뷰 클래스 계층 구조 4 뷰 뷰 뷰 Object View ViewGroup … TextView … LinearLayout

5 Layout XML 구조 5 <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" android:orientation="vertical"> <TextView android:text="@string/hello_world" android:layout_width="wrap_content" android:layout_height="wrap_content" />

6 background –#RGB –#ARGB –#RRGGBB –#AARRGGBB 배경색을 바꾼다 6 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" android:background="#ffff0000" />

7 실습 1: Layout XML Layout XML 확인 TextView 의 Text 변경 및 확인 7

8 LinearLayout 기본 XML 속성 Orientation –Vertical : 포함된 View 를 가로로 배열 –Horizontal : 포함된 View 를 세로로 배열 layout_width and layout_height –match_parent : 화면 전체 설정 –Wrap_content : 포함된 View 의 사이즈 로 설정 Gravity – 내부 View 의 정렬을 설정 –android:gravity="center" 8

9 layout_width, layout_height –match_parent –wrap_content – 상수 몸집 크기를 바꾼다 9 <LinearLayout 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" android:text="@string/hello_world" android:background="#ffff0000" />

10 layout_width, layout_height –match_parent –wrap_content – 상수 몸집 크기를 바꾼다 10 <LinearLayout 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="match_parent" android:text="@string/hello_world" android:background="#ffff0000" />

11 layout_width, layout_height –match_parent –wrap_content – 상수 몸집 크기를 바꾼다 11 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="match_parent" android:text="@string/hello_world" android:background="#ffff0000" />

12 padding –paddingLeft –paddingRight –paddingTop –paddingBottom –padding 내 몸에 빈 공간을 만든다 12 자기자신 자식

13 padding –paddingLeft –paddingRight –paddingTop –paddingBottom –padding 내 몸에 빈 공간을 만든다 13 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" android:background="#ffff0000" android:paddingLeft="30dp" />

14 padding –paddingLeft –paddingRight –paddingTop –paddingBottom –padding 내 몸에 빈 공간을 만든다 14 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" android:background="#ffff0000" android:padding="30dp" />

15 gravity –left, right, top, bottom, center –center_horizontal, center_vertical 자식을 어디에 둘까 ? 15 자기자신 자식

16 gravity –left, right, top, bottom, center –center_horizontal, center_vertical 자식을 어디에 둘까 ? 16 <LinearLayout 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="match_parent" android:text="@string/hello_world" android:background="#ffff0000" android:gravity="right|bottom" />

17 실습 2: 기본 속성 설정 Linearlayout 의 기본 설정을 변경 17

18 TextView 18 Object View

19 Text View Text Attribute –TextSize : Text 의 사이즈 변경 –TextColor : Color 설정 ARGB 형식으로 설정 : android:textColor ="#9933ff22“ 미리 설정된 값 지정 : android:textColor= " @android:color/holo_green_dark " –TextStyle Bold Italic normal 19

20 Text View Attribute 변경 20 <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" android:orientation="vertical"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Robot Class" android:textSize = "55dp" android:textStyle="bold" android:textColor="@android:color/holo_green_dark" />

21 글자 내용을 지정한다 text 21 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" android:background="#ffff0000" />

22 글자 크기를 바꾼다 textSize 22 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize=“80sp" android:text="@string/hello_world" android:background="#ffff0000" />

23 글자 색깔을 바꾼다 textColor –#RGB –#ARGB –#RRGGBB –#AARRGGBB 23 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize=“80sp" android:textColor="#ff0000ff" android:text="@string/hello_world" android:background="#ffff0000" />

24 textStyle –normal –bold –italic 글자 모양을 바꾼다 24 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize=“80sp" android:textColor="#ff0000ff" android:textStyle="italic|bold" android:text="@string/hello_world" android:background="#ffff0000" />

25 한 줄만 쓴다 singleLine –true –false 25 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="80sp" android:textColor="#ff0000ff" android:textStyle="italic|bold" android:singleLine="true" android:text="@string/hello_world" android:background="#ffff0000" />

26 실습 3: 기본 설정 변경 TextView 의 기본 설정을 변경 26

27 실습 4: 전광판 만들기 27

28 Text View Attribute 변경 28 <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" android:background="@android:color/holo_green_light" android:orientation="vertical"> <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="Robot Class" android:textSize = "55dp" android:textStyle="bold" android:gravity="center" android:textColor="@android:color/black" />


Download ppt "전광판 만들기 UNIT 04 로봇 SW 콘텐츠 교육원 조용수. 학습 목표 Layout XML 이란 ? 기본 XML 속성 Text View 2."

Similar presentations


Ads by Google