Tùy chỉnh tùy chọn UI ô tô

Trang này mô tả cách sử dụng và tùy chỉnh các thành phần trong gói com.android.car.ui.preference , bao gồm các thành phần giao diện người dùng có thể dùng để trình bày các tùy chọn cho ứng dụng.

Hầu hết các thành phần đều là các lớp con com.androidx.preference mà bạn thêm các tùy chỉnh CarUi vào đó. Trong hầu hết các trường hợp, bạn có thể sử dụng các phần tử trong gói com.android.car.ui.preferences bằng cách sử dụng com.android.car.PreferenceFragment . PreferenceFragment thay thế tất cả các phần tử androidx.preference bằng các phần tử tương đương trong car.ui.preferences . Để xem các chức năng này đang hoạt động, hãy xem ứng dụng tham khảo Paintbooth car-ui-lib. Ví dụ:

Bố cục tùy chọn giao diện người dùng ô tô

Hình 1. Bố cục tùy chọn giao diện người dùng ô tô.

Các loại tùy chọn có sẵn

Phần này mô tả các loại tùy chọn Giao diện người dùng ô tô.

mảnh ưu tiên

PreferenceFragment là một lớp con của androidx.preference.PreferenceFragmentCompat và là lớp cơ sở mà khách hàng nên sử dụng. Trong lệnh gọi setPreferenceScreen , lớp này sẽ tự động thay thế các phần tử từ androidx.preference bằng phần tử tương đương có sẵn từ các phần tử 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

Đây là CarUi tương đương với lớp androidx.preference.Preference hỗ trợ các thuộc tính sau. Các thuộc tính này có thể được tùy chỉnh bằng cách sử dụng lớp phủ tài nguyên thời gian chạy (RRO). Tất cả các phần tử CarUi khác sử dụng một biến thể của kiểu CarUiPreference cũng hỗ trợ các thuộc tính sau.

<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>

Sau đây là kiểu cơ bản cho com.android.car.ui.preference , mở rộng chủ đề androidx.Preference . chevron có thể vẽ được xác định trong 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 được xác định trong 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>

Nếu bố cục theo kiểu trên đang bị che phủ, khách hàng cần đảm bảo bố cục mới ít nhất cung cấp các id mà các lớp androidx tương ứng mong đợi. Điều này cũng áp dụng cho các phần tử khác sử dụng kiểu cơ bản này.

XeUiThả xuốngSở thích

Đây là CarUi tương đương với lớp androidx.preference.DropDownPreference và sử dụng kiểu sau:

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

CarUiRadioNútSở Thích

Lớp con này của androidx.preference.TwoStatePreference sẽ tăng cường bố cục car_ui_radio_button_preference_widget trong quá trình khởi tạo. Nếu bố cục này được phủ trong RRO thì bố cục mới phải chứa một phần tử thuộc loại android.widget.RadioButton , với id R.id.radio_button và cũng phải chứa các phần tử và id khác mà lớp cơ sở yêu cầu.

CarUiSwitchPreference

Đây là CarUi tương đương với lớp androidx.preference.SwitchPreference . Sự khác biệt là khi phần tử này không được bật, thông báo chúc mừng sẽ được hiển thị. Bạn có thể tùy chỉnh thông báo chúc mừng bằng cách gọi phương thức setMessageToShowWhenDisabledPreferenceClicked trong Android 10 và Android 11. Phần tử này sử dụng kiểu sau:

<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>

CarUiTwoHành độngSở thích

Một lớp con của CarUiPreference cho phép thực hiện hành động phụ. Các thuộc tính có thể được sử dụng để tùy chỉnh phần tử này được cung cấp bên dưới:

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

Phần tử này sử dụng kiểu giống như lớp cơ sở và yêu cầu R.id.action_widget_containerandroid.R.id.widget_frame .

XeUiHộp ThoạiĐoạn

Lớp này được mượn từ androidx.preference.PreferenceDialogFragmentCompat với một số bổ sung dành riêng cho CarUi. Khách hàng nên sử dụng các lớp con của lớp này để trình bày nền tảng theo chủ đề AlertDialog .

Tùy chọnDialogFragment

Một lớp con trực tiếp của CarUiDialogFragment . Khách hàng nên phân lớp này để trình bày bất kỳ nền tảng theo chủ đề nào AlertDialog .

CarUiEditTextPreference

Đây là CarUi tương đương với lớp androidx.preference.EditTextPreference :

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

Nếu bố cục theo kiểu trên đang được phủ lên, thì khách hàng cần đảm bảo rằng bố cục mới cung cấp các id mà lớp androidx.preference.EditTextPreference mong đợi.

EditTextPreferenceDialogFragment

Một lớp con trực tiếp của PreferenceDialogFragment . Ngoài ra, CarUi tương đương với lớp androidx.preference.PreferenceDialogFragments . Khách hàng nên sử dụng lớp này để trình bày bất kỳ nền tảng theo chủ đề nào AlertDialog .

CarUiSeekBarDialogPreference

Việc triển khai lớp androidx.preference.DialogPreference , cung cấp chức năng 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

Một đoạn cung cấp bố cục với SeekBar trong hộp thoại.

CarUiListPreference

CarUi tương đương với lớp androidx.preference.ListPreference .

ListPreferenceFragment

Một đoạn cung cấp bố cục có androidx.preference.ListPreference trong đó.

CarUiMultiSelectListPreference

CarUi tương đương với lớp androidx.preference.Preference .

MultiSelectListPreferenceFragment

Một đoạn cung cấp bố cục có com.android.car.ui.CarUiMultiSelectListPreference trong đó.