หน้านี้ได้รับการแปลโดย Cloud Translation API

การปรับแต่งการตั้งค่า UI ของรถยนต์

บทความนี้อธิบายวิธีใช้และปรับแต่งองค์ประกอบในแพ็คเกจ com.android.car.ui.preference ซึ่งรวมถึงองค์ประกอบ UI ที่สามารถใช้เพื่อนำเสนอการตั้งค่าสำหรับแอพ

องค์ประกอบส่วนใหญ่เป็นคลาสย่อยของคลาสย่อย com.androidx.preference ที่คุณเพิ่มการปรับแต่ง CarUi ในกรณีส่วนใหญ่ คุณสามารถใช้องค์ประกอบในแพ็คเกจ com.android.car.ui.preferences ได้โดยใช้ com.android.car.PreferenceFragment PreferenceFragment แทนที่องค์ประกอบ androidx.preference ทั้งหมดด้วยค่าที่เทียบเท่าใน car.ui.preferences หากต้องการดูฟังก์ชันการทำงานเหล่านี้ โปรดดูที่แอปอ้างอิง car-ui-lib Paintbooth ตัวอย่างเช่น:

เลย์เอาต์การตั้งค่า UI ของรถยนต์

รูปที่ 1 รูปแบบการตั้งค่า UI ของรถยนต์

ประเภทการตั้งค่าที่มีอยู่

PreferenceFragment

PreferenceFragment เป็นคลาสย่อยของ androidx.preference.PreferenceFragmentCompat และเป็นคลาสพื้นฐานที่ไคลเอ็นต์ควรใช้ ระหว่างการโทรไปยัง setPreferenceScreen คลาสนี้จะแทนที่องค์ประกอบจาก androidx.preference โดยอัตโนมัติด้วยองค์ประกอบที่เทียบเท่าจาก car.ui.preference

<style name="PreferenceFragment.CarUi">
        <item name="android:divider">?android:attr/listDivider</item>
        <item name="android:layout">@layout/car_ui_preference_fragment_with_toolbar</item>
</style>

CarUiPreference

ซึ่งเทียบเท่ากับ androidx.preference.Preference ของคลาส androidx.preference.Preference ที่รองรับแอตทริบิวต์ต่อไปนี้ ซึ่งสามารถปรับแต่งได้โดยใช้ Runtime Resource Overlay (RRO) องค์ประกอบ CarUi อื่นๆ ทั้งหมดที่ใช้รูปแบบต่างๆ ของ CarUiPreference ยังสนับสนุนแอตทริบิวต์ต่อไปนี้

<declare-styleable name="CarUiPreference">
      <!-- Toggle for showing chevron -->
      <attr name="showChevron" format="boolean" />
      <!-- Show ripple when disabled preference is clicked -->
      <attr name="showRippleOnDisabledPreference" format="boolean" />
</declare-styleable>

ต่อไปนี้เป็นรูปแบบพื้นฐานสำหรับ com.android.car.ui.preference ซึ่งขยายธีม androidx.Preference chevron ที่ถอนออกได้ถูกกำหนดไว้ใน car_ui_preference_icon_chevron.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_enabled="false" android:drawable="@drawable/car_ui_preference_icon_chevron_disabled"/>
  <item android:state_enabled="true" android:drawable="@drawable/car_ui_preference_icon_chevron_enabled"/>
</selector>

ripple ถูกกำหนดไว้ใน car_ui_recyclerview_button_ripple_background

<ripple
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/car_ui_ripple_color" />

<style name="Preference.CarUi">
        <item name="allowDividerBelow">false</item>
        <item name="allowDividerAbove">false</item>
        <item name="android:layout">@layout/car_ui_preference</item>
</style>

หากเลย์เอาต์ในสไตล์ด้านบนถูกวางซ้อน ไคลเอ็นต์ต้องตรวจสอบให้แน่ใจว่าเลย์เอาต์ใหม่อย่างน้อยมี id ที่คลาส androidx ที่เกี่ยวข้องคาดไว้ นอกจากนี้ยังนำไปใช้กับองค์ประกอบอื่นๆ ที่ใช้รูปแบบพื้นฐานนี้

CarUiDropDownPreference

นี่คือ CarUi ที่เทียบเท่ากับคลาส androidx.preference.DropDownPreference และใช้รูปแบบต่อไปนี้:

<style name="Preference.CarUi.DropDown">
        <item name="android:layout">@layout/car_ui_preference_dropdown</item>
</style>

CarUiRadioButtonPreference

คลาสย่อยของ androidx.preference.TwoStatePreference ขยายโครงร่าง car_ui_radio_button_preference_widget ในระหว่างการเริ่มต้น หากเลย์เอาต์นี้ถูกซ้อนทับใน RRO เลย์เอาต์ใหม่จะต้องมีองค์ประกอบประเภท android.widget.RadioButton โดยมี id R.id.radio_button และต้องมีองค์ประกอบและรหัสอื่นๆ ที่คลาสพื้นฐานต้องการด้วย

CarUiSwitchPreference

นี่เทียบเท่ากับ androidx.preference.SwitchPreference ของคลาส androidx.preference.SwitchPreference ข้อแตกต่างคือเมื่อไม่ได้เปิดใช้งานองค์ประกอบนี้ ข้อความขนมปังปิ้งจะปรากฏขึ้น ข้อความขนมปังปิ้งสามารถปรับแต่งได้โดยการเรียกเมธอด setMessageToShowWhenDisabledPreferenceClicked ใน Android 10 และ Android 11 องค์ประกอบนี้ใช้รูปแบบต่อไปนี้:

<style name="Preference.CarUi.SwitchPreference">
        <item name="android:widgetLayout">@layout/car_ui_preference_widget_switch</item>
        <item name="android:switchTextOn">@string/car_ui_preference_switch_on</item>
        <item name="android:switchTextOff">@string/car_ui_preference_switch_off</item>
</style>

CarUiTwoActionPreference

คลาสย่อยของ CarUiPreference ที่เปิดใช้งานการดำเนินการรอง ของแอตทริบิวต์ที่สามารถใช้เพื่อปรับแต่งองค์ประกอบนี้มีให้ด้านล่าง:

<declare-styleable name="CarUiTwoActionPreference">
        <!-- Determines if the secondary action is initially shown -->
        <attr name="actionShown" format="boolean"/>
</declare-styleable>

อิลิเมนต์นี้ใช้สไตล์เดียวกับคลาสพื้นฐานและต้องใช้ R.id.action_widget_container และ android.R.id.widget_frame

CarUiDialogFragment

คลาสนี้ยืม มา จาก androidx.preference.PreferenceDialogFragmentCompat โดยมีส่วนเพิ่มเติมเฉพาะสำหรับ CarUi ลูกค้าควรใช้คลาสย่อยของคลาสนี้เพื่อนำเสนอ AlertDialog แพลตฟอร์มที่มีธีม

PreferenceDialogFragment

คลาสย่อยโดยตรงของ CarUiDialogFragment ลูกค้าควรคลาสย่อยคลาสนี้เพื่อนำเสนอ AlertDialog แพลตฟอร์มที่มีธีม

CarUiEditTextPreference

นี่เทียบเท่ากับ androidx.preference.EditTextPreference ของคลาส androidx.preference.EditTextPreference:

<style name="Preference.CarUi.DialogPreference.EditTextPreference">
        <item name="android:dialogLayout">@layout/car_ui_preference_dialog_edittext</item>
</style>

หากเลย์เอาต์ในสไตล์ด้านบนถูกวางทับ ลูกค้าต้องตรวจสอบให้แน่ใจว่าเลย์เอาต์ใหม่มีรหัสที่คลาส androidx.preference.EditTextPreference คาดหวัง

แก้ไขข้อความPreferenceDialogFragment

คลาสย่อยโดยตรงของ PreferenceDialogFragment นอกจากนี้ CarUi ยังเทียบเท่ากับคลาส androidx.preference.PreferenceDialogFragments ลูกค้าควรใช้คลาสนี้เพื่อนำเสนอ AlertDialog แพลตฟอร์มที่มีธีม

CarUiSeekBarDialogPreference

การใช้งานคลาส androidx.preference.DialogPreference ซึ่งมีฟังก์ชัน SeekBar :

<style name="Preference.CarUi.SeekBarPreference">
        <item name="android:layout">@layout/car_ui_preference_widget_seekbar</item>
        <item name="adjustable">true</item>
        <item name="showSeekBarValue">false</item>
</style>

SeekBarPreferenceDialogFragment

แฟรกเมนต์ที่ให้เลย์เอาต์ที่มี SeekBar ในไดอะล็อก

CarUiListPreference

CarUi เทียบเท่ากับคลาส androidx.preference.ListPreference

ListPreferenceFragment

แฟรกเมนต์ที่ให้เลย์เอาต์ที่มี androidx.preference.ListPreference อยู่ในนั้น

CarUiMultiSelectListPreference

CarUi เทียบเท่ากับคลาส androidx.preference.Preference

MultiSelectListPreferenceFragment

แฟรกเมนต์ที่ให้เลย์เอาต์ที่มี com.android.car.ui.CarUiMultiSelectListPreference อยู่ในนั้น