뷰를 이용한 화면 구성-3 (기본적인 뷰들)

Bang!·2022년 1월 17일
0

Android(코틀린)

목록 보기
8/15
post-thumbnail

기트허브 링크1(Github link1)(Basics about Views)
기트허브 링크2(Github link2)(Basics about Buttons, CheckBox,Radio)

06-03 기본적인 뷰 살펴보기
텍스트 뷰
- TextView는 문자열을 화면을 출력하는 뷰이다

TextView에서 자주 이용하는 속성들….
andriod:text 속성
- TextView에 출력할 문자열을 지정한다
- 예시) android:text="Button3"
- 아니면 android:text="@string/hello"처럼 문자열 리소스 지정 가능

andriod:textColor 속성
- 문자열 색상을 지정한다
- android:textColor = "#FF0000"처럼 값은 16진수 RGB 형식을 사용

andriod:textSize 속성
- 문자열 크기를 지정한다
- android:textSize = "20sp"처럼 값은 숫자로 지정하여 사용
- 단위는 생략불가
- 단위는 sp,p, 등 사용한다

andriod:textStyle 속성
- 문자열 스타일을 지정
- android:textStyle = "bold"처럼 사용
- 값은 bold, italic, normal 중에서 사용
예시)

andriod:autoLink 속성
- android:autoLink은 출력할 문자열을 분석해 특정 향태의 문자열에 자동 링크를 추가해 준다
- 만약 android:autoLink = "web" 으로 설정하면 문자열에 웹 주소가 포함되면 문자열을 링크 모양으로 표시한다
- 예시)

- 위 예시처럼 autoLink 속성값으로 web, phone, email 등 사용 가능, 
- 여러 갸를 함께 설정해서 '|' 기호로 연결

andriod:maxLines 속성
- android:maxLines = "3"으로 설정하면 문자열이 최대 3행까지만 출력한다

andriod:ellipsize 속성
- 만약 maxLines에서 아직 문자열이 남아 있다고 표시하려면 줄임표(…)를 넣는다
○ 이때 ellipsize 속성을 지정한다
- 'ellipsize' 속성값은 end, middle, start 등으로 설정한다
○ 'end'로 설정하면 문자열 뒤에 줄임표가 추가된다
○ 'start'와 'middle'은 줄임표가 각각 앞부분, 중간 부분에 추가된다
§ 'end'와 달리 singleLine="true" 속성으로 문자열을 줄로 출력했을 때만 적용됨



이미지 뷰
- ImageView는 이미지를 화면에 출력하는 뷰이다
andriod:src 속성
- ImageView에 출력할 이미지를 설정한다
○ 예시) 파일,네트워크, 등 이미지 출력 가능
- 리소스 이미지는 src 속성으로 android:src = "@drawable/image3" 처럼 설정하면 됨

andriod:maxWidth, andriod:maxHeight, andriod:adjustViewBounds 속성
- ImageView가 출력하는 이미지의 최대 크기로 지정

예시)

- andriod:maxWidth, andriod:maxHeight 속성은 android:adjustViewsBounds 속성과 함께 사용해야 길이와 비례해 뷰 크기를 맞출수있다
	○ 이때 adjustViewsBounds 값이 true이어야 한다

버튼, 체크박스, 라디어 버튼
- Button은 사용자 이벤트를 처리하고 CheckBox는 다중 선택, RadioBUtton은 단일 선택하는 뷰이다
예시)

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button1"/>
<!-- Checkboxes -->
<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text = "CheckBox1"/>
<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text = "CheckBox2"/>

<!-- RadioButton -->
<RadioGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text = "RadioButton1"/>
    <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text = "RadioButton2"/>
</RadioGroup>

에디터 텍스터
- EditText는 사용자가 글을 입력할 수 있는 뷰이다

andriod:lines, android:maxLines 속성
- EditText는 한 줄 입력 크킥로 출력도닌느데 사용자가 Enter 누르면 아래로 늘어나서 여러줄이 됨
○ 처음부터 여러 줄 입력 키기로 나오게 하는 속성은 android:lines 이다
○ 만약…
§ 'androidLines = "3"'으로 설정하면 3줄 이상 크기로 화면에 더 이상 안늘어남
§ 화면에서 안늘어나는거지 그 안에 스크롤이 되어 여러 줄을 입력 가능

andriod:inputType 속성
- 'inputType 은 EditText에 글을 입력할 때 올라오는 키보드 지정하는 속성이다
○ 예시) 강제로 키보드로 전화번화 입력모드로 지정하거나 키보드로 한 줄 입력 강제하거나
○ 예시2) android:inputType = "phone'으로 설정하면 전화번호 입력모드로 전환
- 만약 inputType 속성을 설정하지 않으면 여러줄 입력 가능

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

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

profile
pro한 프로그래머가 되자!

0개의 댓글