안드로이드 #2 : 뷰 클래스(TextView, ImageView, EditText, CheckBox, RadioButton, Button) 230228

뷰의 간격

 

- 뷰의 간격은 margin과 padding 속성으로 설정

- margin, padding 속성을 이용하면 간격이 네 방향 모두 같은 크기로 설정

• paddingLeft
• paddingRight
• padding Top
• paddingBottom
• layout_marginLeft
• layout_marginRight
• layout_marginTop
• layout_marginBottom

 

- visibility 속성은 뷰가 화면에 출력되어야 하는지를 설정

- visible, invisible, gone으로 설정

- invisible은 뷰가 화면에 보이지 않지만 자리는 차지

- gone으로 설정하면 자리조차 차지하지 않음

 

- 코드에서 뷰의 visibility 속성을 조정하려면 뷰의 visibility 속성값을 View.VISIBLE이나 View.INVISIBLE로 설정

 

---

TextView

 

- 문자열을 화면에 출력하는 뷰

• android:text 속성 : TextView에 출력할 문자열을 지정
  • android:text=”helloworld”
  • android:text=”@string/hello”
• android:textColor 속성 : 문자열의 색상을 지정
  • android:textColor=”#FF0000”
• android:textSize 속성 : 문자열의 크기를 지정
  • android:textSize=”20sp”
• android:textStyle 속성 : 문자열의 스타일을 지정
  • android:textStyle=”bold”
  • bold, italic, normal 중에서 선택
• android:autoLink 속성 : 출력할 문자열을 분석해 특정 형태의 문자열에 자동 링크를 추가
  • android:autoLink=”web”
  • web, phon, email 등을 사용
• android:maxLines 속성 : 문자열이 특정 줄까지만 나오도록 하는 속성
  • android:maxLines=”3”

• android:ellipsize 속성 : 문자열이 더 있다는 것을 표시하기 위한 줄임표(...)를 추가 
  • end, middle, start 값 지정

 

** singleLine과 ellipsize는 세트!!

 

---

이미지 뷰

 

- 이미지를 화면에 출력하는 뷰

• android:src 속성 : 출력할 이미지를 설정
  • android:src=”@drawable/image3”
• android:maxWidth, android:maxHeight, android:adjustViewBounds 속성 : 이미지의 최대 크기를 지정
  • maxWidth, maxHeight 속성은 android:adjustViewBounds 속성과 함께 사용
  • true로 설정하면 이미지의 가로세로 길이와 비례해 뷰의 크기를 맞춤

 

---

버튼, 체크박스, 라디오 버튼

 

- Button은 사용자 이벤트를 처리하는 뷰

- CheckBox는 다중 선택을 제공하는 뷰

- RadioButton은 단일 선택을 제공하는 뷰

 

** 라디오 버튼은 RadioGroup과 함께 사용하며 그룹으로 묶은 라디오 버튼 중 하나만 선택할 수 있게 설정

      <RadioGroup ....... <RadioButton ............/> <RadioButton ............/> /> 

 

---

에디트 텍스트

 

- 글을 입력할 수 있는 뷰

• android:lines, android:maxLines 속성
  • 처음부터 여러 줄 입력 크기로 나오게 하는 속성이 android:lines
  • maxLines 은 처음에는 한 줄 입력 크기로 출력되다 지정한 크기까지 늘어남
• android:inputType 속성
  • 글을 입력할 때 올라오는 키보드를 지정하는 속성
  • android:inputType=”phone”

 

android:adjustViewBounds = "true"          실제 컨텐츠의 크기랑 차지하는 자리의 크기를 같게 해주는 것.

 

property	description
none	입력 유형을 지정하지 않은 상태. 모든 문자 입력 가능하며 줄바꿈 가능
text	문자열 한 줄 입력
textCapCharacters	대문자 입력 모드
textCapWords	각 단어의 첫 글자 입력 시 키보드가 자동으로 대문자 입력 모드
textCapSentences	각 문단의 첫 글자 입력 시 키보드가 자동으로 대문자 입력 모드
textMultiLine	여러 줄 입력 가능
textNoSuggestions	단어 입력 시 키보드의 추천 단어를 보여 주지 않음
textUri	URL 입력 모드
textEmailAddress	이메일 주소 입력 모드
textPassword	비밀번호 입력 모드로 입력한 문자를 점으로 표시. 키보드는 영문자와 숫자, 특수 키만 표시
textVisiblePassword	textPassword와 같으며 입력한 문자 표시
number	숫자 입력 모드
numberSigned	number와 같으며 부호 키인 마이너스(-) 입력 가능
numberDecimal	number와 같으며 소숫점 입력 가능
numberPassword	숫자 키만 입력 가능. 입력한 문자는 점으로 표시
phone	전화번호 입력 모드

 

---

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON1"
        android:backgroundTint="#FF00E6"
        android:padding="30dp" />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="BUTTON2"
        android:backgroundTint="#7700FF"
        android:paddingBottom="50dp"
        android:layout_marginLeft="50dp" />

</LinearLayout>

버튼 padding 실습

 

---

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="hahee"
        android:textColor="#7C80FF"
        android:textSize="20sp"
        android:textStyle="bold"
        android:adjustViewBounds = "true" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="하히의 티스토리 - 웹페이지 : https://hhahee.tistory.com/ 전화번호 : 202020-2020-2020 이메일 : hahee2538@naver.com"
        android:autoLink="web|email|phone" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:maxWidth="100dp"
        android:maxHeight="100dp"
        android:adjustViewBounds="true"
        android:src="@drawable/antifragile"
        android:background="#DCDEFF" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="걸어봐 위엄 like a lion 눈빛엔 거대한 desire
        더 부어 gasoline on fire 불길 속에 다시 날아 rising
        잊지 마 내가 두고 온 toe shoes 무슨 말이 더 필요해
        무시 마 내가 걸어온 커리어
        I go to ride till I die die"
        android:ellipsize="middle"
        android:singleLine="true" />

    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="check2" />

    <RadioGroup
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="radio1" />
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="radio2" />
    </RadioGroup>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BUTTON1"
        android:backgroundTint="#FF00E6"
        android:padding="30dp" />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="BUTTON2"
        android:backgroundTint="#7700FF"
        android:paddingBottom="50dp"
        android:layout_marginLeft="50dp" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="phone" />
</LinearLayout>

TextView, ImageView, CheckBox, RadioGroup (+RadioButton), Button, EditText 실습

android:ellipsize="middle"
android:singleLine="true"

singleLine : 한줄로 ellipsize : 줄임표시 가운데(middle)

---

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/username"
        android:textStyle="bold"
        android:textSize="24dp"
        android:inputType="text"
        android:hint="이름을 입력하세요" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/favoritenum"
        android:textStyle="bold"
        android:textSize="24dp"
        android:inputType="number"
        android:hint="좋아하는 숫자를 입력하세요" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/address"
        android:textStyle="bold"
        android:textSize="24dp"
        android:inputType="text"
        android:hint="주소를 입력하세요" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/profile"
        android:textStyle="bold"
        android:textSize="24dp"
        android:inputType="none"
        android:hint="자기소개를 입력하세요" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/phonenum"
        android:textStyle="bold"
        android:textSize="24dp"
        android:inputType="phone"
        android:hint="핸드폰 번호를 입력하세요" />
</LinearLayout>

EditText 실습