안드로이드 테두리 한쪽만 - andeuloideu teduli hanjjogman

I have seen the question asked many times on how to create an XML drawable in Android that has only a top and bottom border or perhaps one side of the border missing.

Searching the web you will find many people answer that this cannot be done when in fact the solution is really quite simple

So what we want to do is convert this:

Into something like this using an XML drawable:

The simple answer is to use the inset tag as follows:

<?xml version="1.0"encoding="utf-8"?>

<inset xmlns:android="//schemas.android.com/apk/res/android"

        android:insetLeft="-10dp"

        android:insetRight="-10dp">

    <shape android:shape="rectangle">

        <stroke android:width="10dp"android:color="#ff0000"/>

        <solid android:color="#00000000"/>

    </shape>

</inset>

We are basically shifting the image to a negative offset in both directions. You might ask if this will still show the left and right borders if your containing view doesn’t take up the full screen. The answer is no, the drawing is limited to the bounds of the view itself thus we have shifted part of the drawing outside of the bounds thus solving our problem.

테두리를 추가하는 것이지만 실질적으론 백그라운드 이미지를 추가해 테두리를 지정한 것 같은 느낌을 주는 것이다.

drawable에서 우클릭을해 xml을 추가해 준다.

테두리용이기 때문에 이름을 edge로 지정해 줬다.

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <!--배경색을 의미, 이미지의 중간 중간이 투명한 색상이라면 여기서 지정한 색이 보이게 된다.--> <!--동일하게 투명하게는 @null을 입력해 주면 된다.--> <stroke android:width="10dp" android:color="#000000"/> <!--stroke 선으로 테두리를 그린다. 여기서 색상은 테두리 색상을 의미--> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> <!--padding으로 크기를 줄여 백그라운드에 그려진 이미지를 보이게 한다.--> <!--패딩의 크기를 더 주면 테두리가 더 두꺼워진다. 지정할 곳을 left, top, right, bottom으로--> </shape>

을 추가해준다.

그 후 적용할 위젯에서 background를 적용해 주면 완료!

<ImageView android:id="@+id/imageView29" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:background="@drawable/edge" app:srcCompat="@color/colorAccent" /> <!--drawable/edge로 만든 것을 배경으로 지정해줬다.-->

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <stroke android:width="10dp" android:color="#000000" android:dashWidth="10dp" android:dashGap="1dp"/> <!--dashWidth는 선 하나하나의 크기고, dashGap은 선 하나를 그리고 얼마를 띄고 다시 그릴지를 의미--> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> </shape>

android:dashWidth="10dp" android:dashGap="1dp"

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <stroke android:width="10dp" android:color="#000000" android:dashWidth="10dp" android:dashGap="10dp"/> <!--dashWidth는 선 하나하나의 크기고, dashGap은 선 하나를 그리고 얼마를 띄고 다시 그릴지를 의미--> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> </shape>

android:dashWidth="10dp" android:dashGap="10dp"

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <stroke android:width="10dp" android:color="#000000" android:dashWidth="20dp" android:dashGap="10dp"/> <!--dashWidth는 선 하나하나의 크기고, dashGap은 선 하나를 그리고 얼마를 띄고 다시 그릴지를 의미--> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> <!--padding으로 크기를 줄여 백그라운드에 그려진 이미지를 보이게 한다.--> </shape>

android:dashWidth="20dp" android:dashGap="10dp"

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <stroke android:width="10dp" android:color="#000000" /> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> <corners android:radius="50dp"/> <!--corners를 추가해 주면 가장자리가 둥그렇게 된다. 숫자가 높을 수록 원에 가까워진다.--> </shape>

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <solid android:color="#ffffff"/> <stroke android:width="10dp" android:color="#000000" /> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> <corners android:bottomLeftRadius="50dp" android:topRightRadius="50dp"/> <!--이렇게 모서리를 지정해 둥글게도 할 수 있다. 오른쪽 위와 왼쪽 아래 지정--> </shape>

오른쪽 위와 왼쪽 아래 지정

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="//schemas.android.com/apk/res/android"> <gradient android:startColor="#ffffff" android:endColor="#ff00000" android:angle="45"/> <!--solid는 단색이지만 gradient 으로 그라데이션을 줄 수도 있다.--> <stroke android:width="10dp" android:color="#000000" /> <padding android:left="1dp" android:top="1dp" android:right="1dp" android:bottom="1dp" /> <corners android:bottomLeftRadius="50dp" android:topRightRadius="50dp"/> </shape>

Toplist

최신 우편물

태그