以下は私のコードです:
<androidx.cardview.widget.CardView
android:id="@+id/cv_back"
android:layout_width="@dimen/walletFuncFrameSize"
android:layout_height="@dimen/walletFuncFrameSize"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="24dp"
android:layout_marginStart="24dp"
app:cardCornerRadius="250dp">
<androidx.cardview.widget.CardView
android:layout_width="@dimen/walletFuncSize"
android:layout_height="@dimen/walletFuncSize"
app:cardCornerRadius="250dp"
android:layout_gravity="center">
<ImageView
android:layout_width="@dimen/walletFuncImageSize"
android:layout_height="@dimen/walletFuncImageSize"
android:background="@drawable/back"
android:scaleType="centerCrop"
android:layout_gravity="center" />
</androidx.cardview.widget.CardView>
</androidx.cardview.widget.CardView>
Android 10 スマートフォンでテストすると、問題なく動作しました。しかし、Android 8.0 スマートフォンでテストすると、画像が表示されません。
すべてのカードビューを削除しようとしましたが、imageView のみを保持し、最終的に画像が表示されました。
この問題を解決する方法を知っている人はいますか?
私も試してみました:
src と srcCompat および ImageView の背景
両方の androidx.cardview.widget.CardView を com.google.android.material.card.materialCardView に変更します。
1 つの CardView を削除する
app:cardCornerRadius="250dp"と;適切な半径を指定します。例: 20dp 、 30dp
– チャンド・モハド
2020 年 9 月 3 日 10:42
@chandmohd CardView を円として作成したいのですが、
– ベルリン
2020 年 9 月 3 日 10:45
@chandmohd は、実際にあなたが指摘した問題であることがわかりました。どうもありがとうございます:D
– ベルリン
9月2020 年 3 月 11:03
------------------------
内側のカード ビューまたはその両方から半径を削除してみてください。
画像が表示される場合は、半径を小さくするか、カード ビューのサイズを大きくする必要があります。
両方のカード ビューの半径が大きすぎるため、ImageView が表示されません。また、カード ビューが十分に大きくないため、半径が画像と重なっている可能性があります。
------------------------
カード ビュー内にレイアウトを配置し、画像ビューをその子にします。
<androidx.cardview.widget.CardView
android:id="@+id/cv_back"
android:layout_width="@dimen/walletFuncFrameSize"
android:layout_height="@dimen/walletFuncFrameSize"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="24dp"
android:layout_marginStart="24dp"
app:cardCornerRadius="250dp">
<LinearLayout
android:layout_width="@dimen/walletFuncSize"
android:layout_height="@dimen/walletFuncSize"
android:background="@drawable/oval"
android:orientation=vertical
android:layout_gravity="center">
<ImageView
android:layout_width="@dimen/walletFuncImageSize"
android:layout_height="@dimen/walletFuncImageSize"
android:background="@drawable/back"
android:scaleType="centerCrop"
android:layout_gravity="center" />
</LinearLayout>
</androidx.cardview.widget.CardView>
@drawable/oval:
<shape android:shape="oval" xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/colorPrimary" />
</shape>
------------------------
画像を円形で表示したい場合
マテリアル デザイン ライブラリは、カスタム シェイプを使用せずに任意のシェイプを作成する ShapeableImageView を提供します
例:
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/ivSchoolIcon"
android:layout_width="56dp"
android:layout_height="56dp"
android:adjustViewBounds="true"
android:padding="2dp"
android:scaleType="centerCrop"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:shapeAppearanceOverlay="@style/circleImageView"
app:srcCompat="@drawable/ic_kid_placeholder" />
style.xml でスタイルを定義します。
<style name="circleImageView" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">50%</item>
<item name="android:shadowRadius">100</item>
<item name="android:shadowColor">@color/gray</item>
<item name="backgroundOverlayColorAlpha">12</item>
</style>
依存関係:
implementation 'com.google.android.material:material:1.3.0-alpha01'