programing

Android - 상단에만 둥근 모서리로 그릴 수 있음

codeshow 2023. 10. 19. 22:55
반응형

Android - 상단에만 둥근 모서리로 그릴 수 있음

저는 이 그림을 바탕으로 둥근 직사각형을 그릴 수 있었습니다.

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/white" />
    <stroke android:width="1dp" android:color="@color/light_gray" />
    <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" />
    <corners android:radius="6dp" />
</shape>

역시 잘 되네요.

이제 맨 위 모서리만 둥글게 변경하려고 합니다. 그래서 다음과 같이 변경합니다.

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@color/white" />
    <stroke android:width="1dp" android:color="@color/light_gray" />
    <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" />
    <corners android:topLeftRadius="6dp" android:topRightRadius="6dp"
             android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp"/>
</shape>

하지만 지금은 어느 모서리도 둥글지 않고 평평한 직사각형이 생겼습니다.내가 뭘 놓치고 있는 거지?

다음과 같은 값을 부여해 봅니다.

 <corners android:topLeftRadius="6dp" android:topRightRadius="6dp"
         android:bottomLeftRadius="0.1dp" android:bottomRightRadius="0.1dp"/>

제가 변경되었음을 참고합니다.0dp로.0.1dp.

편집: 더 깔끔한 버전은 아래 Aleks G 코멘트 참조

다음과 같은 작업을 시도해 보십시오.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:bottom="-20dp" android:left="-20dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/white" />

            <corners android:radius="20dp" />
        </shape>
    </item>
</layer-list>

사각형의 모서리 반지름을 다르게 설정하는 것은 적합하지 않은 것 같습니다.그래서 이 해킹을 이용할 수 있습니다.

나의 경우 아래 code

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

        <shape android:shape="rectangle">
            <solid android:color="@color/maincolor" />

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

    </item>
    </layer-list>
bg.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF"/>
    <corners android:topLeftRadius="24dp" android:topRightRadius="24dp"
        android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp"/>
</shape>

레이아웃에 추가:

android:background="@drawable/bg"

바쁜 사람들의 대답을 토대로, 이것이 당신이 그것을 만드는 방법입니다.drawable둥근 모서리가 하나뿐인 경우(이 예에서는 상단 왼쪽):

<?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/white" />
            <!-- A numeric value is specified in "radius" for demonstrative purposes only,
                  it should be @dimen/val_name -->
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!-- To keep the TOP-LEFT corner UNROUNDED set both OPPOSITE offsets (bottom+right): -->
    <item
        android:bottom="10dp"
        android:right="10dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/white" />
        </shape>
    </item>
</layer-list>

위의 내용을 참고하시기 바랍니다.drawableAndroid Studio 미리 보기(2.0.0p7)에 올바르게 표시되지 않습니다.미리 보려면 다른 보기를 작성하고 다음과 같이 사용합니다.android:background="@drawable/...".

써 보다MaterialShapeDrawable코틀린/java 코드로 구성합니다.

val backgroundShapeModel:ShapeAppearanceModel = ShapeAppearanceModel.builder()
    .setTopLeftCorner(CornerFamily.ROUNDED, 16F.toPx)
    .setTopRightCorner(CornerFamily.ROUNDED, 16F.toPx)
    .build()
textView.background = MaterialShapeDrawable(backgroundShapeModel).apply {
    fillColor = ColorStateList.valueOf(Color.GREEN)
}

enter image description here

추신:

그 능력 외에xml그림 그리기 기능(채움 색, 획...),MaterialShapeDrawable지원:

  1. cornerFamily두 가지 범주에서:rounded그리고.cut
  2. edgeTreatment와 함께TriangleEdgeTreatment,OffsetEdgeTreatment, ...
  3. 상황을 파악하고 리소스를 확보할 필요가 없음

enter image description here]

val backgroundShapeModel = ShapeAppearanceModel.builder()
    .setTopLeftCorner(CornerFamily.ROUNDED, 16F.toPx)
    .setTopRightCorner(CornerFamily.CUT, 16F.toPx)
    .setAllEdges(TriangleEdgeTreatment(5f.toPx, true))
    .build()
textView.background = MaterialShapeDrawable(backgroundShapeModel).apply {
    fillColor = ColorStateList.valueOf(Color.GREEN)
    setStroke(2f.toPx,Color.RED)
}

당신은 이 https://developer.android.com/guide/topics/resources/drawable-resource.html#Shape 을 읽어야 할 지도 모릅니다.

그리고 아래에는 노트가 있습니다.

참고 모든 모서리에는 (처음에) 1보다 큰 모서리 반지름이 제공되어야 합니다. 그렇지 않으면 모서리가 둥글지 않습니다.특정 모서리를 반올림하지 않으려면 Android:radius를 사용하여 기본 모서리 반지름을 1보다 크게 설정한 다음 각 모서리를 원하는 값으로 재정의하여 반올림하지 않는 모서리를 0("0dp")으로 제공하는 방법이 있습니다.

그리기 가능한 곳에 rung_top_conners.xml을 작성하고 아래 코드를 복사합니다.

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<corners
    android:topLeftRadius="22dp"
    android:topRightRadius="22dp"
    android:bottomLeftRadius="0dp"
    android:bottomRightRadius="0dp"
    />
<gradient
    android:angle="180"
    android:startColor="#1d2b32"
    android:centerColor="#465059"
    android:endColor="#687079"
    android:type="linear" />
<padding
    android:left="0dp"
    android:top="0dp"
    android:right="0dp"
    android:bottom="0dp"
    />
<size
    android:width="270dp"
    android:height="60dp"
    /></shape>

당신의 코드를 시도해봤는데 모서리 버튼이 위로 둥글어졌어요.색상은 다음과 같이 했습니다.@ffffff그리고 내가 준 획은#C0C0C0.

해라

  1. 안드로이드 제공: 작동하지 않는 경우 0. 대신 하단 LeftRadius="0.1dp"
  2. 그림을 그릴 수 있는 것과 에뮬레이터의 해상도를 확인합니다.저는 밑에 그릴 수 있는 폴더를 만들어서 사용했습니다.(hdpi, mdpi ldpi) 이 XML을 가진 폴더입니다. 이것이 제 출력입니다.

enter image description here

이러한 특성을 모두 제거해 보십시오.

android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp"

언급URL : https://stackoverflow.com/questions/8930555/android-drawable-with-rounded-corners-at-the-top-only

반응형