所選專案表面上的奇怪帶顏色-有解無憂

當回收器視圖中突出顯示選擇時，我有一個奇怪的問題。根據我的測驗，此問題出現在 API 級別 30 及以上。在較低的 API 級別中，我沒有觀察到任何類似的問題，至少 API 低于 28。

API 30 的截圖	API 27 的截圖

此螢屏截圖取自運行 Android 11 的摩托羅拉 G5S Plus	這個取自運行 Android 8.1.0 的 General Mobile 6

兩部手機都運行相同版本的應用程式。正如您在左圖中看到的那樣，突出顯示的區域內有一條帶。在這個區域有 2 個離散TextView的 s 和它們之間的一些差距。

讓我們看一下名為him_selector.xml的高亮顏色 xml ：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.4" android:color="?attr/colorSecondaryVariant" android:state_activated="true"/>
    <item android:color="?attr/colorSurface"/>
</selector>

以下 xml 是串列項設計。

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <import type="android.view.View"/>
        <import type="com.himtec.himtec_kontrol.ui.viewmodel.AygitListelemeVM"/>

        <variable name="kipSurukle" type="boolean"/>
        <variable name="gozde" type="boolean"/>

    </data>

    <com.himtec.himtec_kontrol.ui.AygitMaterialCardView
        android:id="@ id/amcv_aygit"
        style="@style/Widget.Himtec.MaterialCardView.Elevated.RoundCorners.Large"
        android:layout_width="match_parent"
        android:layout_height="@dimen/him_card_device_height"
        android:layout_margin="@dimen/him_card_device_margin"
        android:checkable="false"
        android:clickable="true"
        android:clipChildren="true"
        android:clipToPadding="false"
        android:focusable="true"
        app:cardBackgroundColor="@color/him_selector" <!-- I use that color selector as card's background color to highlight it when it is selected -->
        app:cardMaxElevation="@dimen/him_card_drag_elevation"
        app:cardPreventCornerOverlap="false">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:id="@ id/cl_aygit"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:duplicateParentState="true">

            <View
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:background="?attr/colorPrimary"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="@id/gl_aygit_model_icerik_hiza"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@ id/iv_nokta_simge"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:contentDescription="@string/cd_aygitSimgesi"
                android:duplicateParentState="true"
                android:scaleType="center"
                android:tint="?attr/colorSurface"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toStartOf="@ id/gl_aygit_model_icerik_hiza"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:srcCompat="@drawable/him_aygit_simge_selector"
                tools:srcCompat="@drawable/him_aygit_simge_selector" />


            <com.google.android.material.textview.MaterialTextView
                android:id="@ id/tv_nokta_ad"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:gravity="center_vertical"
                android:padding="2dp"
                android:singleLine="true"
                android:textAlignment="gravity"
                android:textAppearance="@style/TextAppearance.MaterialComponents.Body1"
                app:layout_constraintBottom_toTopOf="@ id/mtv_eklenme"
                app:layout_constraintEnd_toStartOf="@ id/tus_sirala"
                app:layout_constraintStart_toStartOf="@ id/gl_aygit_model_icerik_hiza"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_goneMarginEnd="@dimen/him_card_content_padding_8dp" />

            <com.google.android.material.textview.MaterialTextView
                android:id="@ id/mtv_eklenme"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:gravity="center_vertical"
                android:padding="2dp"
                android:singleLine="true"
                android:text="@string/sc_eklendi"
                android:textAlignment="gravity"
                android:textSize="12sp"
                app:layout_constraintBottom_toTopOf="@ id/mtv_son_baglanma"
                app:layout_constraintStart_toStartOf="@ id/gl_aygit_model_icerik_hiza"
                app:layout_constraintTop_toBottomOf="@ id/tv_nokta_ad"
                app:layout_constraintVertical_chainStyle="packed" />

            <com.google.android.material.textview.MaterialTextView
                android:id="@ id/mtv_eklenme_deger"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:gravity="center_vertical"
                android:padding="2dp"
                android:singleLine="true"
                android:textAlignment="gravity"
                android:textSize="12sp"
                app:layout_constraintBaseline_toBaselineOf="@ id/mtv_eklenme"
                app:layout_constraintEnd_toStartOf="@ id/tus_sirala"
                app:layout_constraintStart_toEndOf="@id/br_aygit_model_alt_bilgi_baslik"
                app:layout_goneMarginEnd="@dimen/him_card_content_padding_8dp" />

            <com.google.android.material.textview.MaterialTextView
                android:id="@ id/mtv_son_baglanma"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:gravity="center_vertical"
                android:padding="2dp"
                android:singleLine="true"
                android:text="@string/sc_sonBaglanti"
                android:textAlignment="gravity"
                android:textSize="12sp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="@ id/gl_aygit_model_icerik_hiza"
                app:layout_constraintTop_toBottomOf="@ id/mtv_eklenme" />

            <com.google.android.material.textview.MaterialTextView
                android:id="@ id/mtv_son_baglanma_deger"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="5dp"
                android:gravity="center_vertical"
                android:padding="2dp"
                android:singleLine="true"
                android:textAlignment="gravity"
                android:textSize="12sp"
                app:layout_constraintBaseline_toBaselineOf="@ id/mtv_son_baglanma"
                app:layout_constraintEnd_toStartOf="@ id/tus_sirala"
                app:layout_constraintStart_toEndOf="@id/br_aygit_model_alt_bilgi_baslik"
                app:layout_goneMarginEnd="@dimen/him_card_content_padding_8dp" />


            <Button
                android:id="@ id/tus_sirala"
                style="@style/Widget.Himtec.Button.TextButton"
                android:layout_width="36dp"
                android:layout_height="0dp"
                android:visibility="@{kipSurukle ? View.VISIBLE : View.GONE}"
                app:icon="@drawable/him_surukle_24"
                app:iconPadding="0dp"
                app:iconSize="24dp"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <androidx.constraintlayout.widget.Barrier
                android:id="@ id/br_aygit_model_alt_bilgi_baslik"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:barrierDirection="end"
                app:constraint_referenced_ids="mtv_eklenme,mtv_son_baglanma"
                tools:layout_editor_absoluteX="169dp" />

            <androidx.constraintlayout.widget.Guideline
                android:id="@ id/gl_aygit_model_icerik_hiza"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintGuide_begin="82dp" />

        </androidx.constraintlayout.widget.ConstraintLayout>

    </com.himtec.himtec_kontrol.ui.AygitMaterialCardView>
</layout>

在這兩款手機中，存在相同的專案 xml 和顏色。突出顯示是通過激活AygitMaterialcardView擴展的自定義類來實作的MaterialCardView。通過將View.setActivated()方法設定為 true 來進行激活。

自定義卡片實作：

public class AygitMaterialCardView extends MaterialCardView {
    private static final String E = AygitMaterialCardView.class.getSimpleName();

    /* Uygulamaya ?zel tan?mlanan durumlar */
    private static final int DURUM_HICBIRI = 0;
    private static final int DURUM_GOZDE = 1;
    private static final int DURUM_SURUKLE = 2;

    private static final int[] HIM_AYGIT_DURUMLAR = {
            R.attr.durum_hicbiri,
            R.attr.durum_gozde,
            R.attr.durum_surukleme
    };

    private boolean gozde;
    private boolean surukleme;
    private int durum;

    public AygitMaterialCardView(Context context) {
        super(context);
    }

    /* XML kaynaktan ilklenirken bu olu?turucu ?a?r?l?yor */
    public AygitMaterialCardView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected int[] onCreateDrawableState(int extraSpace) {
        final int[] drawableStates = super.onCreateDrawableState(extraSpace  1);

        // Fazladan g?zde durumunu ekleyece?iz
        if(gozde) {
            int[] d = { HIM_AYGIT_DURUMLAR[DURUM_GOZDE] };
            mergeDrawableStates(drawableStates, d);
        }
        if(surukleme) {
            int[] d = { HIM_AYGIT_DURUMLAR[DURUM_SURUKLE] };
            mergeDrawableStates(drawableStates, d);
        }
        return drawableStates;
    }

    public boolean isGozde() {
        return gozde;
    }

    public void setGozde(boolean gozde) {
        if(gozde == this.gozde) return;
        this.gozde = gozde;
        refreshDrawableState();
        invalidate();
        requestLayout();
    }

    public boolean isSurukleme() {
        return surukleme;
    }

    public void setSurukleme(boolean surukleme) {
        if(surukleme == this.surukleme) return;
        this.surukleme = surukleme;
        refreshDrawableState();
        invalidate();
        requestLayout();
    }
}

uj5u.com熱心網友回復：

歸因于 Mike M. 的解決方案。感謝他的指導，我可以看到問題的原因是由選擇器的 alpha 設定引起的半透明背景顏色。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.4" android:color="?attr/colorSecondaryVariant" android:state_activated="true"/>
    <item android:color="?attr/colorSurface"/>
</selector>

有兩種解決方案可以消除該故障：

是將卡片的高程設定為零并權衡陰影。
是從選擇顏色中去除alpha。

因為我不想為我的設計要求權衡陰影，所以我決定擺脫 alpha 并使選擇顏色完全純色。

轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/484830.html

標籤：安卓用户界面选择 android-api 级别

上一篇：下拉元素未定位

下一篇：如何將List<T>系結到表單上的相關文本框？