선형 레이아웃의 한쪽에만 테두리를 그리는 방법은 무엇입니까?


186

선형 레이아웃으로 테두리를 그릴 수는 있지만 모든면에 그려집니다. CSS에서와 같이 오른쪽으로 만 제한하고 싶습니다 (border-right : 1px solid red;).

나는 이것을 시도했지만 여전히 모든면에서 그립니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
    <shape android:shape="rectangle" >
        <stroke
            android:height="2dp"
            android:width="2dp"
            android:color="#FF0000" />

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

        <padding
            android:bottom="0dp"
            android:left="0dp"
            android:right="1dp"
            android:top="0dp" />

        <corners
            android:bottomLeftRadius="0dp"
            android:bottomRightRadius="5dp"
            android:radius="1dp"
            android:topLeftRadius="5dp"
            android:topRightRadius="0dp" />
    </shape>
</item>

이것을 달성하는 방법에 대한 제안?

BTW, 나는 필요한면에 너비 1dp의 시야를 두는 해킹을 사용하고 싶지 않습니다.


레이아웃에서 drawableLeft를 사용할 수 있습니다.
njzk2

답변:


359

이것을 사용하여 한쪽 테두리를 얻을 수 있습니다

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="#FF0000" />
    </shape>
</item>
<item android:left="5dp">
    <shape android:shape="rectangle">
        <solid android:color="#000000" />
    </shape>
</item>
</layer-list>

편집

나를 포함한 많은 사람들이 투명한 배경의 한쪽 테두리를 원했기 때문에 BorderDrawableCSS를 사용하는 것과 같은 방식으로 다른 크기와 색상의 테두리를 줄 수있는를 구현했습니다 . 그러나 이것은 xml을 통해 사용할 수 없습니다. XML을 지원하기 BorderFrameLayout위해 레이아웃을 래핑 할 수있는를 추가했습니다 .

전체 소스는 내 github 을 참조하십시오 .


5
아래쪽 테두리가있는 단색 알파 기반 색상을 원한다면 어떻게해야합니까? Android Drawable XML API를 사용하여 솔루션을 생각하고 있지만 이해할 수 없습니다.
마리오 Lenci

이것은 나에게 효과가 없었습니다. 이상하게는 내부에서 더 어두운 색을 원했던 것과 반대로, 보더를 위해 오버레이 된 회색 그라디언트와 반대였습니다. 항목에 drawableLeft로 놓을 사각형을 특정 크기로 그릴 수 있도록 생각했습니다. 간소화 된 것처럼 보이지 않습니다.
jbenowitz 2016 년

@jbenowitz : 레이어 목록에서 항목의 순서가 더 중요합니다. U를 반대로하면 결과가 나타납니다.
Vivek Khandelwal 2013 년

테두리 색상과 버튼 색상으로 남은 모양을 획으로 추가 하여이 문제를 해결했습니다. 그 트릭을했다.
jbenowitz

242

파이처럼 쉽고 투명한 bg를 허용합니다.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:angle="0"
        android:startColor="#f00"
        android:centerColor="@android:color/transparent"
        android:centerX="0.01" />
</shape>

경계 위치를 변경하려면 각도를 변경하십시오.

  • 0 = 남음
  • 90 = 바닥
  • 180 = 오른쪽
  • 270 = 상단

19
이것은 여기까지 가장 좋은 대답이며, 너무 나쁘지 않습니다.
mittelmania

11
그러나 나는 그것을 "파이처럼 쉬운"것으로 묘사하지 않을 것입니다.
funkybro

7
두꺼운 테두리가 필요하거나 여러면에 테두리가 필요한 경우에는 작동하지 않습니다.
홀로그램 원리

1
@ codeman-뷰의 배경으로 사용하면 높이가 상속됩니다.
Oded Breiner

2
획 또는 테두리 너비를 조정하는 방법은 무엇입니까?
Ruturaj Patil

101

단일 레이어를 사용하여 원하는 것을 구현할 수도 있습니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:bottom="-5dp"
        android:right="-5dp"
        android:top="-5dp">
        <shape android:shape="rectangle" >
            <solid android:color="@color/color_of_the_background" />

            <stroke
                android:width="5dp"
                android:color="@color/color_of_the_border" />
        </shape>
    </item>

</layer-list>

이 방법은 왼쪽의 경계는 볼 수 있지만 함께 연주하여 원하는 조합을 달성 할 수있는 bottom, left, righttop의 속성 item요소


3
이것은 다른 배경색이 있고이 드로어 블 bg를 테두리로 오버레이하려는 경우에 유용합니다. (y)
Aung Pyae

3
정확히 내가 필요한 것은 있지만 부정적인 패딩을 사용하는 것이 옳습니까?
IlyaEremin 2016 년

1
이것이 가장 좋은 해결책입니다. 나는 -5dp 가하는 일을 귀찮게합니다.
Amit Kumar

1
음수 패딩은 HTML / CSS에서 일반적입니다. 그것은 단순히 다른 방향으로 물건을 조금씩 움직입니다. 내 경험에 따르면 Android에서도 완벽하게 유효합니다.
spaaarky21

레이아웃에 clipChildren = false 또는 clipToPadding = false가 있으면 음수 여백을 사용하는 구현이 제대로 작동하지 않습니다. 이 경우이 경우 비벡 김시연에 의해 제안처럼, 당신은 두 개의 중첩 된 사각형과 솔루션을 사용할 수 있습니다
헤수스 발레라를

80

드로어 블의 한면에만 테두리를 만들려면 inset다른 세면에 네거티브 를 적용합니다 (화면에서 테두리가 그려 지도록).

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetTop="-2dp" 
    android:insetBottom="-2dp"
    android:insetLeft="-2dp">

    <shape android:shape="rectangle">
        <stroke android:width="2dp" android:color="#FF0000" />
        <solid android:color="#000000" />
    </shape>

</inset>

여기에 이미지 설명을 입력하십시오

이 방법은 naykah의 답변과 비슷하지만을 사용하지 않습니다 layer-list.


4
이것이 최고의 답변입니다.
James

아주 좋은 대답, 나는 너비를 변경하고 10dp로 삽입해야합니다 :) 그리고 더, 왼쪽에 테두리가 필요하므로 android : insetLeft를 android : insetRight로 변경하십시오. 너무 간단합니다! 자료 버튼 클릭 유지 : D
Phuong

정확히 내가 필요한 insertX것은 상단에서 변경 하여 표시 할 테두리와 표시하지 않을 테두리를 결정합니다.
CularBytes 2016 년

단색의 @null을 가질 수 있으며이 방법으로 오버 드로우가 발생하지 않습니다. 천재. 감사합니다!
Unknownweirdo

2
주의 : 이렇게하면 뷰의 내용이 바뀌고 크기도 조정됩니다. 주의해서 사용하십시오.
vovahost

7

대안으로 (배경을 사용하지 않으려는 경우) 다음과 같이보기를 통해 쉽게 수행 할 수 있습니다.

<View
    android:layout_width="2dp"
    android:layout_height="match_parent"
    android:background="#000000" />

오른쪽 테두리 만있는 경우 레이아웃 다음 (배치하려는 위치) 뒤에 배치하십시오.

<View
    android:layout_width="2dp"
    android:layout_height="match_parent"
    android:background="#000000" />

왼쪽 테두리 만있는 경우 레이아웃 앞에 테두리를 배치하십시오 (테두리를 배치하려는 위치).

나를 위해 일했습니다 ... 도움이 필요합니다 ....


6

다음 코드로 효과를 얻을 수있었습니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:left="0dp" android:right="-5dp" android:top="-5dp" android:bottom="-5dp">
        <shape
        android:shape="rectangle">
            <stroke android:width="1dp" android:color="#123456" />
        </shape>
    </item>
</layer-list>

변위 방향을 변경하여 경계 위치에 대한 요구를 조정할 수 있습니다


5
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" >
        <shape>
            <solid
                android:color="#f28b24" />
            <stroke
                android:width="1dp"
                android:color="#f28b24" />
            <corners
                android:radius="0dp"/>
            <padding
                android:left="0dp"
                android:top="0dp"
                android:right="0dp"
                android:bottom="0dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:startColor="#f28b24"
                android:endColor="#f28b24"
                android:angle="270" />
            <stroke
                android:width="0dp"
                android:color="#f28b24" />
            <corners
                android:bottomLeftRadius="8dp"
                android:bottomRightRadius="0dp"
                android:topLeftRadius="0dp"
                android:topRightRadius="0dp"/>
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

5

다른 좋은 예 예

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 
<inset xmlns:android="http://schemas.android.com/apk/res/android"
     android:insetRight="-2dp">

     <shape android:shape="rectangle">
         <corners
             android:bottomLeftRadius="4dp"
             android:bottomRightRadius="0dp"
             android:topLeftRadius="4dp"
             android:topRightRadius="0dp" />
         <stroke
             android:width="1dp"
             android:color="@color/nasty_green" />
         <solid android:color="@android:color/transparent" />
     </shape>

</inset>

2

9 패치 파일 에 대한 언급은 여기에 없습니다. 예, 파일을 작성해야하지만 작업이 매우 쉽고 " 버전 간 투명성 지원 "솔루션입니다. 파일이 drawable-nodpi디렉토리에 배치되면 파일은 px기반으로 drawable-mdpi작동하며 대략 dp base (재 샘플링 덕분)로 작동합니다.

원래 질문에 대한 예제 파일 ( border-right : 1px solid red; )은 다음과 같습니다.

http://ge.tt/517ZIFC2/v/3?c

그냥에 배치 drawable-nodpi디렉토리.


2

다른 색상의 테두리. 나는 3 개의 아이템을 사용했다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/colorAccent" />
        </shape>
    </item>
    <item android:top="3dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/light_grey" />
        </shape>
    </item>
    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="3dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorPrimary" />
        </shape>
    </item>
</layer-list>
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.