web-dev-qa-db-ja.com

プログラムでチップウィジェットのスタイルを変更できない-Android

私はチップスでリストをやっています。このチップを選択できるようにしたいので、 https://material.io/develop/Android/components/chip/ を見て、「Choice Chip」を使用できることを確認します。

動的に作成して追加する必要があるので、特定の色、色の波紋などで構成する必要があります。

だから私はそれを設定する必要があります:

val chip = Chip(context, null, R.style.CustomChipChoice)
            chip.isClickable = true
            chip.isCheckable = true
            chip.isCheckedIconVisible=false
            chip.height = ScreenUtils.dpToPx(40)
            chip.chipCornerRadius = (ScreenUtils.dpToPx(20)).toFloat()
            chip.chipStrokeWidth = (ScreenUtils.dpToPx(2)).toFloat()
            chip.setTextAppearanceResource(R.style.ChipTextStyle)
            return chip

私が試すことR.style.CustomChipChoiceは:

CustomChipChoiceスタイル

<style name="CustomChipChoice" parent="@style/Widget.MaterialComponents.Chip.Choice">
        <item name="chipBackgroundColor">@color/background_color_chip_state_list</item>
        <item name="chipStrokeColor">@color/background_color_chip_state_list</item>
        <item name="rippleColor">@color/topic_social_pressed</item>
</style>

background_color_chip_state_list

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@color/topic_social_selected" Android:state_checked="true" />
    <item Android:color="@color/topic_social_pressed" Android:state_pressed="true" />
    <item Android:color="@color/topic_unselected_background" />
</selector>

stroke_color_chip_state_list

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@color/topic_social_pressed" Android:state_checked="true"/>
    <item Android:color="@color/grey_material2" Android:state_checked="false"/>
</selector>

ご覧のとおり、チップをクリック可能およびチェック可能にします(不要なチェックアイコンは非表示にします)。

しかし、テストすると、色が設定されていません。チップはデフォルトの色(グレーのスケール)として表示されます

このカスタムスタイルはどこに適用できますか?

PS:

CustomStyleが不正な形式であるかどうかなどを確認するために、高速テストを行いました。

私はxml経由でビューを追加し、完全に動作しました...

<Android.support.design.chip.Chip
                Android:id="@+id/test"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                style="@style/CustomChipChoice"
                Android:checkable="true"
                Android:clickable="true"
                app:checkedIconVisible="false"
                Android:text="Chip Test"/>
13
Shudy

コードでチップスタイルを設定するために、以下を試すことができます。

val chip = Chip(context)
val drawable = ChipDrawable.createFromAttributes(context, null, 0, R.style.Widget_MaterialComponents_Chip_Choice)
chip.setChipDrawable(drawable)
2
Tomer

XMLレイアウト(_single_chip_layout.xml_)を使用して、単一のChipを好みのスタイルで定義します。

_<com.google.Android.material.chip.Chip
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    style="@style/CustomChipChoice"
    ...
/>
_

_<style name="CustomChipChoice" parent="@style/Widget.MaterialComponents.Chip.Choice">
...
</style>
_

次にval chip = Chip(context, null, R.style.CustomChipChoice)の代わりに

_val chip = layoutInflater.inflate(R.layout.single_chip_layout, chipGroup, false) as Chip
_

Javaの場合:

_Chip chip =
          (Chip) getLayoutInflater().inflate(R.layout.single_chip_layout, chipGroup, false);
_
2

CustomChipChoiceはスタイルではなく、単にスタイルへの参照です。したがって、R.style.CustomChipChoiceをそれに変更します。R.attr.CustomChipChoice

val newChip = Chip(context, null, R.attr.CustomChipChoice)

その前に、このCustomChipChoicein values.xmlファイルをプロジェクトに追加する必要があります。このため。プロジェクトにvalues.xmlがない場合は、valuesディレクトリに作成します。

次に、このようにCustomChipChoiceを追加します。

values.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <attr name="CustomChipChoice" format="reference" />
</resources>

styles.xmlで、このようにスタイルを追加します。

styles.xml

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
        .
        .
        <item name="CustomChipChoice">@style/CustomChipChoiceStyle</item>
        .
        .
</style>

これで、CustomChipChoice attrがこのスタイルを参照するようになり、styles.xmlファイルでカスタムスタイルを作成できるようになりました。

styles.xml

<style name="CustomChipChoiceStyle" parent="@style/Widget.MaterialComponents.Chip.Action">
        .
        <item name="checkedIconVisible">false</item>
        <item name="Android:focusable">true</item>
        <item name="Android:clickable">true</item>
        <item name="chipBackgroundColor">@color/colorWhite</item>
        <item name="chipIcon">@drawable/ic_filter</item>
        <item name="chipIconVisible">true</item>
        <item name="textStartPadding">0dp</item>
        <item name="textEndPadding">0dp</item>
        .
        .
        <item name="Android:textAppearance">@style/ChipTextStyleAppearance</item>
</style>

チップのテキストの外観を変更したい場合。こちらがChipTextStyleAppearanceです。このように追加できます。

styles.xml

<style name="ChipTextStyleAppearance">
        <item name="Android:fontFamily">@font/main_font</item>
        <item name="Android:textSize">13dp</item>
        <item name="Android:textColor">#ffffff</item>
</style>

AppThemeまたはapplicationタグのandroidManifest.xmlactivityを追加することを忘れないでください。

androidManifest.xml

<application
        .
        .
        Android:theme="@style/AppTheme">

<activity
            .
            .
            Android:theme="@style/AppTheme" />
0
Mojtaba Haddadi