[Android] round box 만들기

 

---

 가끔 버튼을 만들다 보면 리스트나 특정 박스를 만들어 내부에 정보를 표기하고 싶은 경우가 생기곤 합니다.

이미지를 통한 라운드 박스의 경우 고정 크기 아니면 이미지가 깨지는 단점이 있기 때문에 주로 xml 디자인을 통해 적용하는 게 제일 깔끔한 편입니다. (제가 아는 지식에서는...)

사용법은 매우 간단하지만 쓰려고 기억력을 소비하기엔 좀 아까우니 그냥 놔뒀다가 복붙하는게 제일이죠

---

[Android] round box 만들기

 일단 res > drawable 폴더에 border.xml을 한개 만들어주고 아래의 소스를 복붙 합니다.

res > drawable > New > Drawable Resource File

border.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@android:color/transparent"/>
    <stroke
        android:width="1dp"
        android:color="#9e8181"/>
    <padding
        android:bottom="5dp"
        android:left="5dp"
        android:right="5dp"
        android:top="5dp"/>
    <corners
        android:bottomLeftRadius="7dp"
        android:bottomRightRadius="7dp"
        android:topLeftRadius="7dp"
        android:topRightRadius="7dp"/>
</shape>

생성된 border라는 이미지를 RelativeLayout의 배경(android:background)으로 적용해줍니다.

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:background="@drawable/border"
    android:layout_margin="20dp"
    >
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="텍스트박스 활용의 예입니다."
</RelativeLayout>

RelativeLayout에 적용한 예

---

설명

android:shape에는 [rectangle/oval/line/ring] 네 가지 형태로 만들 수 있습니다.

    - rectangle: 사각형

    - oval: 원형

    - line: 선형

    - ring: 원통형

 

<solid>

    : rectangle에서 solid는 사각형 내부 색상(android:color)만 적용 가능합니다.

    - color: 사각형 내부 색상

 

<stroke>

    : rectangle에서 stroke는 사각형 테두리에 관한 설정입니다.

    - width: 테두리 선의 두께

    - color: 테두리 선의 색상

    - dashGap: 테두리를 직선(solid)이 아닌 점선(dashed)으로 적용하려는 경우, 해당 점 간의 간격

    - dashWidth: 테두리를 직선(solid)가 아닌 점선(dashed)로 적용하려는 경우, 해당 점의 길이

 

<padding>

    : 사각형 내부의 여백으로 버튼에서 사용 시 글자와 테두리 사이의 간격을 의미합니다.

 

<cornors>

    : 모서리가 둥근 버튼을 만드는 경우 적용 가능합니다. 크기에 따라 원형까지도 가능합니다.

 

<gradient>

    : 버튼 내부에 그라이디언트를 적용할 경우 가능합니다.

---

[Android] Round Box 만들기

🇺🇸 English

2024.02.13 - [개발 창고/Android] - [Android] How to make round box