Shape Drawable

300x250

300x250

Android 에는 XML 로 쉽게 drawable 객체를 생성할 수 있는 Shape Drawable 이라는 것이 있다.

이번 포스팅에서는 Shape Drawable 에 대해 알아보자.

Syntex

<shape>

◼ android:shape

도형의 종류 지정 (하단 4가지)

“rectangle” (사각형)

 

“oval” (타원)

 

“line” (선)

 

 

“ring” (링)

android:shape="ring" 인 경우 하단과 같은 추가 속성이 존재한다.

- android:innerRadius

안쪽원의 반지름 값

- android:innerRadiusRatio

안쪽원의 반지름 비율

- android:thickness

원의 두께

- android:thicknessRatio

원의 두께 비율

- android:useLevel

Boolean 값으로 "true"이면 Shape는 LevelListDrawable 객체로 생성된다.

일반적으로는 "false"로 설정하면 된다.

 

“ring” (링) - value

 

“ring” (링) - ratio

 

<coners>

shape 가 "rectangle" 에만 적용되는 속성으로 가장자리를 둥글게  처리한다.

- android:radius

모든 모서리를 둥글게 처리

- android:topLeftRadius

좌측 상단 모서리를 둥글게 처리

- android:topRightRadius

우측 상단 모서리를 둥글게 처리

- android:bottomLeftRadius

좌측 하단 모서리를 둥글게 처리

android:bottomRightRadius

우측 하단 모서리를 둥글게 처리

 

 

<gradient>

도형에 gradient 색상을 지정할 수 있다.

- android:type

Gradient 패턴의 종류를 지정 (하단 3가지)

"linear" - 직선형 gradient (디폴트)

 

"radial" - 방사형 gradient

 

"sweep" - 스위핑 라인형 gradient

 

 

- android:angle

gradient 각도 설정

값이 0이면 좌측에서 우측으로 gradient가 지정되며, 90이면, bottom에서 top 방향으로 gradient 지정

- android:centerX

gradient 의 X축 중심점 지정 (0 ~ 1.0)

android:type="linear" 이면 적용이 안됨.

- android:centerY

gradient 의 Y축 중심점 지정 (0 ~ 1.0)

android:type="linear" 이면 적용이 안됨.

- android:centerColor

gradient 중간 색상 지정

- android:startColor

gradient 시작 색상 지정

- android:endColor

gradient 끝 색상 지정

- android:gradientRadius

gradient 의 반지름 값.

android:type="radial" 인 경우에만 적용 가능

- android:useLevel

Boolean 값으로 "true"이면 Shape는 LevelListDrawable 객체로 생성된다.

일반적으로는 "false"로 설정하면 된다.

<padding>

도형 안쪽에 패딩(여백) 값 지정

- android:left

도형 안쪽의 좌측 여백

- android:right

도형 안쪽의 우측 여백

- android:top

도형 안쪽의 상위 여백

- android:bottom

도형 안쪽의 하위 여백

 

 

 

<size>

도형의 크기 지정

도형의 크기가 적용되기 위해서는 해당 view 의 크기를 "wrap_content" 로 해야한다.

- android:height

도형의 높이

- android:width

도형의 너비

 

 

<solid>

도형의 단색 지정

- android:color

도형 면 색상

 

 

<stroke>

선과 관련된 설정

- android:width

선의 두께 지정

- android:color

선 색 지정

- android:dashGap

점선인 경우 점선의 간격

- android:dashWidth

점선의 크기

 

 

Source code

https://github.com/parkho79/ShapeSample