web-dev-qa-db-ja.com

CardViewコーナー半径

CardViewの上部の角の半径のみを作成する方法はありますか？

<Android.support.v7.widget.CardView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:cardCornerRadius="10dp"
    >
androidandroid-appcompat
74
squeeish

Android CardViewクラスを拡張しようとしない限り、XMLからその属性をカスタマイズすることはできません。

それにもかかわらず、その効果を得る方法があります。

CardViewを別のCardView内に配置し、透明な背景を外側のCardViewに適用して、その角の半径（"cornerRadios = 0dp"）を削除します。たとえば、内部のCardViewのcornerRadius値は3dpになります。次に、内部CardViewにmarginTopを適用します。これにより、その下部境界が外部CardViewによってカットされます。これにより、内部のCardViewの下隅の半径が非表示になります。

XMLコードは次のとおりです。

 <Android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/card_view_outer"
    Android:layout_width="match_parent"
    Android:layout_height="200dp"
    Android:layout_gravity="center"
    card_view:cardBackgroundColor="@Android:color/transparent"
    card_view:cardCornerRadius="0dp"
    card_view:cardElevation="3dp" >

    <Android.support.v7.widget.CardView
        xmlns:card_view="http://schemas.Android.com/apk/res-auto"
        Android:id="@+id/card_view_inner"
        Android:layout_width="match_parent"
        Android:layout_height="200dp"
        Android:layout_gravity="center"
        Android:layout_marginTop="3dp"
        card_view:cardBackgroundColor="@color/green"
        card_view:cardCornerRadius="4dp"
        card_view:cardElevation="0dp" >
    </Android.support.v7.widget.CardView>
</Android.support.v7.widget.CardView>

また、視覚効果は次のとおりです。

CardView with rounded corners only on top

常にコンテンツをインナーCardViewに入れてください。外側のCardViewは、内側のCardViewの下部の丸い角を「隠す」という目的にのみ役立ちます。

96
joao2fast4u
dependencies: compile 'com.Android.support:cardview-v7:23.1.1'

<Android.support.v7.widget.CardView
    Android:layout_width="80dp"
    Android:layout_height="80dp"
    Android:elevation="12dp"
    Android:id="@+id/view2"
    app:cardCornerRadius="40dp"
    Android:layout_centerHorizontal="true"
    Android:innerRadius="0dp"
    Android:shape="ring"
    Android:thicknessRatio="1.9">
    <ImageView
        Android:layout_height="80dp"
        Android:layout_width="match_parent"
        Android:id="@+id/imageView1"
        Android:src="@drawable/Your_image"
        Android:layout_alignParentTop="true"
        Android:layout_centerHorizontal="true">
    </ImageView>
</Android.support.v7.widget.CardView>
32
shreedhar bhat

カスタムの角丸位置に描画可能なライブラリを作成しました。次のようになります。

example.png

このライブラリはここで入手できます。

https://github.com/mthli/Slice

6
mthli

このドローアブルxmlを使用して、cardviewの背景として設定できます。

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <solid Android:color="#ffffffff"/>

    <stroke Android:width="1dp"
        Android:color="#ff000000"
        />

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

    <corners 
        Android:topLeftRadius="7dp"
        Android:topRightRadius="7dp"/>
</shape>
6
Surender Kumar

カードが画面の一番下にあるときに、それを達成する方法の例があります。誰かがこの種の問題を抱えているなら、そのようなことをしてください：

<Android.support.v7.widget.CardView
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_marginBottom="-5dp"
    card_view:cardCornerRadius="4dp">

    <SomeView
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_marginBottom="5dp">

    </SomeView>

</Android.support.v7.widget.CardView>

カードビューのボトムマージンはマイナスです。カードビュー内のビューも同じですが、下マージンはプラスです。この方法では、丸みを帯びた部分が画面の下に隠れますが、内側のビューにはカウンターマージンがあるため、すべてがまったく同じに見えます。

4
koras

次の2つのことを行う必要があります。

1）CardViewでsetPreventCornerOverlap(false)を呼び出します。

2）PutroundedCardView内のImageview

画像ビューの丸めについては、同じ問題があったので、各コーナーに異なる半径を設定できるライブラリを作成しました。最後に、私が望んでいた結果を以下に示しました。

https://github.com/pungrue26/SelectableRoundedImageView

Rounded ImageView inside CardView

2
김준호

これを実現する簡単な方法は次のとおりです。

1.角の丸いカスタム背景リソース（長方形のような）を作成します。

2.コマンドを使用してこのカスタム背景を設定します-

cardView = view.findViewById(R.id.card_view2);
cardView.setBackgroundResource(R.drawable.card_view_bg);

これは私のために働いた。

左上と右下の半径で作成したXMLレイアウト。

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
<solid Android:color="@color/white" />
<corners Android:topLeftRadius="18dp" Android:bottomRightRadius="18dp" />
</shape>

あなたのケースでは、topLeftRadiusとtopRightRadiusのみを変更する必要があります。

カードビューのコーナーと重なるレイアウトがあり、色が異なる場合は、レイアウト用に異なる背景リソースファイルが必要になることがあり、xmlでこの背景リソースをレイアウトに設定します。

上記の方法を試し、テストしました。これがお役に立てば幸いです。

0
Ankit Deshmukh

プログラムでカードの背景を設定する場合は、cardView.setCardBackgroundColor()ではなくcardView.setBackgroundColor()を使用し、cardView.xmlでapp:cardPreventCornerOverlap="true"を使用してください。それは私のためにそれを修正しました。

ところで、上記のコード（引用符内）はJavaではなくKotlinにあります。 Javaを使用している場合は、同等のJavaを使用してください。

0
Joseph Magara

ライブラリを使用できます： OptionRoundCardview

enter image description here

0
qinmiao