programing

Android View의 위쪽과 아래쪽에 테두리를 쉽게 추가할 수 있는 방법이 있습니까?

instargram 2023. 6. 6. 00:26
반응형

Android View의 위쪽과 아래쪽에 테두리를 쉽게 추가할 수 있는 방법이 있습니까?

텍스트 보기가 있는데 위쪽과 아래쪽 테두리를 따라 검은색 테두리를 추가하고 싶습니다.추가해봤습니다.android:drawableTop그리고.android:drawableBottom텍스트 보기에 표시되지만 전체 보기가 검은색으로 변했습니다.

<TextView
    android:background="@android:color/green"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:drawableTop="@android:color/black"
    android:drawableBottom="@android:color/black"
    android:text="la la la" />

Android에서 보기(특히 TextView)에 위쪽 및 아래쪽 테두리를 쉽게 추가할 수 있는 방법이 있습니까?

Android 2.2에서는 다음을 수행할 수 있습니다.

/res/drawable/textlines.xml과 같은 xml 그리기 가능한 파일을 만들고 이 파일을 TextView의 백그라운드 속성으로 할당합니다.

<TextView
android:text="My text with lines above and below"
android:background="@drawable/textlines"
/>

/res/drawable/textline.xml

<?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:width="1dp" android:color="#FF000000" />
            <solid android:color="#FFDDDDDD" />

        </shape>
   </item>

   <item android:top="1dp" android:bottom="1dp"> 
      <shape 
        android:shape="rectangle">
            <stroke android:width="1dp" android:color="#FFDDDDDD" />
            <solid android:color="#00000000" />
        </shape>
   </item>

</layer-list>

단점은 투명도가 작동하지 않기 때문에 불투명한 배경색을 지정해야 한다는 것입니다. (적어도 저는 그렇게 했다고 생각했지만 제가 착각했습니다.)위의 예에서는 첫 번째 도형 #FFDDddd의 단색이 두 번째 도형 스트로크 색으로 복사되는 것을 볼 수 있습니다.

테두리가 용기 외부에 표시되도록 트릭을 사용했습니다.이 트릭을 사용하면 기본 뷰의 배경이 표시되도록 선만 그려집니다.

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

            <solid android:color="#00FFFFFF" />

            <padding android:left="10dp"
                android:right="10dp"
                android:top="10dp"
                android:bottom="10dp" />
        </shape>
    </item>

</layer-list>

a를 추가하기1dp하단에만 흰색 테두리가 있고 투명한 배경을 가지려면 여기에 있는 대부분의 답변보다 간단한 다음을 사용할 수 있습니다.

TextView또는 다른 보기 추가:

android:background="@drawable/borderbottom"

리고에서.drawable는 "이라고 하는 다음 합니다.borderbottom.xml

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

에▁the,면▁at려▁change▁if▁border하표시▁a,▁you▁top를,android:top="-2dp"android:bottom="-2dp"

색상은 흰색일 필요가 없으며 배경도 투명할 필요가 없습니다.

solid요소가 필요하지 않을 수 있습니다.이는 사용자의 설계에 따라 달라집니다.칼루주뉴).

기본적으로 이 XML은 직사각형 모양을 사용하여 테두리를 작성하지만 모양의 렌더 영역 너머로 위쪽, 오른쪽 및 왼쪽을 밀어넣습니다.이렇게 하면 맨 아래 테두리만 표시됩니다.

옵션 1: 도형 그리기 가능

배경을 설정할 수 있는 레이아웃 또는 보기 주위에 테두리를 두르는 가장 간단한 옵션입니다. 파일로 .drawable다음과 같은 폴더:

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

    <solid android:color="#8fff93" />

    <stroke
        android:width="1px"
        android:color="#000" />

</shape>

다음을 제거할 수 있습니다.solid만약 당신이 채우기를 원하지 않는다면. 트세background="@drawable/your_shape_drawable"사용자의 레이아웃/보기.

옵션 2: 배경 보기

여기 제가 사용한 작은 속임수가 있습니다.RelativeLayout기본적으로 테두리를 지정할 뷰 아래에 검은색 사각형이 있고 해당 뷰에 여백이 아닌 패딩을 지정하여 가장자리에 검은색 사각형이 표시되도록 합니다.

보기에 투명한 영역이 없는 경우에만 제대로 작동합니다., 저는 인 그렇면다커스, 쓰는 것을 합니다.BorderView경계만 그립니다. 수십 줄의 코드여야 합니다.

<View
    android:id="@+id/border"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/image"
    android:layout_alignLeft="@+id/image"
    android:layout_alignRight="@+id/image"
    android:layout_alignTop="@+id/main_image"
    android:background="#000" />

<ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_...
    android:padding="1px"
    android:src="@drawable/..." />

궁금하시다면, 이 제품은adjustViewBounds=true그러나 전체적인 배경이 필요한 경우에는 작동하지 않습니다.RelativeLayout왜냐하면 당신이 메우는 것을 막는 버그가 있기 때문입니다.RelativeLayoutView그렇다면, 저는 그것을 추천합니다.Shape그리기 쉬운

옵션 3: 9-패치

마지막 옵션은 다음과 같은 9-패치 드로잉 가능을 사용하는 것입니다.

설정할 수 있는 모든 보기에서 사용할 수 있습니다.android:background="@drawable/..."그리고 예, 6x6이어야 합니다. 5x5를 시도했지만 작동하지 않았습니다.

이 방법의 단점은 색상을 쉽게 변경할 수 없다는 것입니다. 하지만 화려한 테두리(예: 이 질문에서와 같이 위쪽과 아래쪽의 테두리만)를 원한다면, 당신은 그것들을 사용하지 못할 수도 있습니다.Shape그리 강력하지 않은 드로잉 가능합니다.

옵션 4: 추가 보기

보기 위와 아래의 테두리만 원하는 경우 이 매우 간단한 옵션을 언급하는 것을 잊었습니다.당신은 수 .LinearLayout없는 ) 합니다.View는 그위와 에 이렇게 :s 위와아이되있어습다니게렇래는.

<View android:background="#000" android:layout_width="match_parent" android:layout_height="1px"/>

현재 수락된 답변이 작동하지 않습니다.안티에일리어싱의 결과로 보기의 왼쪽과 오른쪽에 얇은 수직 테두리를 만듭니다.

이 버전은 완벽하게 작동합니다.또한 테두리 너비를 독립적으로 설정할 수 있으며, 원하는 경우 왼쪽/오른쪽에 테두리를 추가할 수도 있습니다.유일한 단점은 투명성을 지원하지 않는다는 것입니다.

이 "xml"인 xml 한 파일을 ./res/drawable/top_bottom_borders.xml아래 코드를 사용하여 TextView의 백그라운드 속성으로 할당합니다.

<?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="#DDDD00" /> <!-- border color -->
        </shape>
    </item>

    <item
        android:bottom="1dp" 
        android:top="1dp">   <!-- adjust borders width here -->
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF" />  <!-- background color -->
        </shape>
    </item>
</layer-list>

Mashmallow를 통해 Android KitKat에서 테스트 완료

그래서 저는 약간 다른 것을 하고 싶었습니다. ListView 구분자를 시뮬레이션하기 위해 아래쪽에만 테두리를 두었습니다.저는 Piet Delport의 답변을 수정했고 다음과 같이 받았습니다.

<?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/background_trans_light" />    

        </shape>
   </item>

    <!-- this mess is what we have to do to get a bottom border only. -->
   <item android:top="-2dp"
         android:left="-2dp"
         android:right="-2dp"
         android:bottom="1px"> 
      <shape 
        android:shape="rectangle">    
            <stroke android:width="1dp" android:color="@color/background_trans_mid" />
            <solid android:color="@null" />
        </shape>
   </item>

</layer-list>

정확히 1픽셀 분할기를 얻으려면 dp 대신 px를 사용하십시오(일부 전화 DPI는 1dp 라인을 사라지게 함).

res/drawable에 파일 추가

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

이 파일의 링크를 백그라운드 속성에 추가합니다.

@Nic Hubbard가 말했듯이, 경계선을 추가하는 매우 쉬운 방법이 있습니다.

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

높이와 배경색을 원하는 대로 변경할 수 있습니다.

또한 보기를 프레임 레이아웃으로 래핑한 다음 프레임의 배경색 및 패딩을 원하는 대로 설정할 수 있습니다. 그러나 텍스트 보기에는 기본적으로 '투명' 배경이 있으므로 텍스트 보기의 배경색도 변경해야 합니다.

제 답변은 @Emile 버전을 기반으로 하지만 단색 대신 투명한 색상을 사용합니다.
이 예에서는 2dp 하단 테두리를 그립니다.

<?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:width="2dp"
                     android:color="#50C0E9" />
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
    <item  android:bottom="2dp" >
        <shape android:shape="rectangle" >
            <stroke  android:width="2dp"
                     android:color="@color/bgcolor" />
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</layer-list>

@color/bgcolor는 테두리로 뷰를 그리는 배경의 색상입니다.

테두리의 위치를 변경하려면 다음 중 하나를 사용하여 오프셋을 변경합니다.

android:bottom="2dp"
android:top="2dp"
android:right="2dp"
android:left="2dp"

또는 두 개 이상의 경계를 갖도록 결합합니다.

android:bottom="2dp" android:top="2dp"

테두리를 추가하여 테두리를 삽입하는 가장 간단한 방법은 다음과 같습니다.InsetDrawable.

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

        <solid android:color="@color/light_gray" />
        <stroke
            android:width=".5dp"
            android:color="@color/dark_gray" />
    </shape>
</inset>

이 코드 스니펫으로 이 작업을 수행할 수 있습니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--Minus (-) how much dp you gave in the stroke width from left right-->
    <item android:left="-10dp" android:right="-10dp">
        <shape
            android:shape="rectangle">
            <stroke android:width="10dp" android:color="@android:color/holo_red_dark" />
           <!--This is the main background -->
            <solid android:color="#FFDDDDDD" />
        </shape>
    </item>
</layer-list>

미리 보기 -

여기에 이미지 설명 입력

배경색으로 1dp 하이 뷰를 만들면 어떨까요?그러면 그것은 당신이 원하는 곳에 쉽게 배치될 수 있습니다.

변경 방법:

<TextView
    android:text="My text"
    android:background="@drawable/top_bottom_border"/>

"drawable/top_bottom_border.xml"에서 이 접근 방식을 선호합니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient
                android:angle="270"
                android:startColor="#000"
                android:centerColor="@android:color/transparent"
                android:centerX="0.01" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:angle="90"
                android:startColor="#000"
                android:centerColor="@android:color/transparent"
                android:centerX="0.01" />
        </shape>
    </item>
</layer-list>

배경에 색상이 있을 경우 나타나는 직사각형이 아니라 테두리만 만듭니다.

제 솔루션을 목록에 추가하기 위해서입니다.

저는 원래 모양을 지나 확장되는 반투명 하단 테두리를 원했습니다(따라서 반투명 테두리는 상위 직사각형 외부에 있었습니다).

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
  <item>
    <shape android:shape="rectangle" >      
      <solid android:color="#33000000" /> <!-- Border colour -->
    </shape>
  </item>
  <item  android:bottom="2dp" >
    <shape android:shape="rectangle" >     
      <solid android:color="#164586" />
    </shape>
  </item>
</layer-list>

그래서 나는;

여기에 이미지 설명 입력

먼저 아래에 표시된 내용으로 xml 파일을 만들고 border.xml로 이름을 지정한 후 res 디렉토리 내의 레이아웃 폴더 안에 배치합니다.

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="1dp" android:color="#0000" />
    <padding android:left="0dp" android:top="1dp" android:right="0dp"
        android:bottom="1dp" />
</shape>

그 후 코드 사용 내부에서

TextView tv = (TextView)findElementById(R.id.yourTextView);
tv.setBackgroundResource(R.layout.border);

텍스트 보기의 맨 위와 맨 아래에 검은색 선이 표시됩니다.

맨 위와 맨 아래에 보기를 추가하기만 하면 됩니다.View

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/your_color"
        app:layout_constraintBottom_toTopOf="@+id/textView"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintStart_toStartOf="@+id/textView" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:gravity="center"
        android:text="Testing"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@color/your_color"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintStart_toStartOf="@+id/textView"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

</android.support.constraint.ConstraintLayout>

코드 아래에 적으십시오.

<View
    android:layout_width="wrap_content"
    android:layout_height="2dip"
    android:layout_below="@+id/topics_text"
    android:layout_marginTop="7dp"
    android:layout_margin="10dp"
    android:background="#ffffff" />

이미지를 선형 레이아웃으로 감싸고 배경을 텍스트 주위에 원하는 테두리 색으로 설정합니다.그런 다음 텍스트 보기의 패딩을 테두리 두께로 설정합니다.

9-경로를 사용하여 작업을 수행할 수도 있습니다.색상이 지정된 픽셀의 높이가 증가하지 않고 투명 픽셀만 증가하도록 만듭니다.

Pi Delport와 Emile의 수락된 답변을 바탕으로 조금 더 간단하게 만들었습니다.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>  <!--divider TOP and BOTTOM-->
    <shape android:shape="rectangle">
        <stroke 
            android:width="1dp"
            android:color="@color/divider" />
    </shape>
</item>

<!--background surface-->
<item
    android:top="1dp"
    android:bottom="1dp">
    <shape android:shape="rectangle">
        <solid android:color="@color/background" />
    </shape>
</item>
// Just simply add border around the image view or view

<ImageView
                android:id="@+id/imageView2"
                android:layout_width="90dp"
                android:layout_height="70dp"
                android:layout_centerVertical="true"
                android:layout_marginRight="10dp"
                android:layout_toLeftOf="@+id/imageView1"
                android:background="@android:color/white"
                android:padding="5dip" />

// After that dynamically put color into your view or image view object

objView.setBackgroundColor(Color.GREEN);

//VinodJ/Abhishek
<shape xmlns:android="http://schemas.android.com/apk/res/android">

<solid android:color="@color/light_grey1" />
<stroke
    android:width="1dip"
    android:color="@color/light_grey1" />

<corners
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="0dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" />

    </shape>
<TextView
    android:id="@+id/textView3"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="#72cdf4"
    android:text=" aa" />

테두리를 추가할 텍스트 아래에 이 텍스트 보기 추가

@preakhead 님과 사용자 1051892 님의 답변을 강제하기 위해,<item android:bottom|android:left|android:right|android:top>음인경다커합야니다보다 .<stroke android:width>그렇지 않으면 항목의 그림이 스트로크의 그림과 혼합되어 이러한 값이 작동하지 않는다고 생각할 수 있습니다.

언급URL : https://stackoverflow.com/questions/1598119/is-there-an-easy-way-to-add-a-border-to-the-top-and-bottom-of-an-android-view

반응형