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

ปรับแต่ง CarUiRecyclerView

หน้านี้อธิบายขั้นตอนการปรับแต่งCarUiRecyclerViewและการเลื่อน แถบ

สิ่งที่ต้องมีก่อน

หน้านี้ถือว่ามีความรู้เกี่ยวกับ APK เป้าหมายการซ้อนทับทรัพยากรรันไทม์ (RRO) เพื่อเรียนรู้ โปรดดูหัวข้อปรับแต่งแอป

เกี่ยวกับ CarUiRecyclerView

เมื่อตั้งค่า car_ui_scrollbar_enable เป็น false ใน bools.xml CarUiRecyclerView ไม่ขยายแถบเลื่อน อย่างไรก็ตาม มีเพียง androidx.recyclerview สูงกว่าความเป็นจริงด้วยรูปแบบที่ปรับแต่งได้ตามที่ให้คำจำกัดความไว้ด้านล่าง เมื่อตั้งค่า car_ui_scrollbar_enable เป็น true CarUiRecyclerView ขยายคอนเทนเนอร์เมื่อมีการติดตั้งแถบเลื่อน ที่อยู่ข้างใน androidx.recyclerview ภายหลังจะเพิ่มไว้ภายใน คอนเทนเนอร์

CarUiRecyclerView สามารถใช้อะแดปเตอร์ใดก็ได้เพื่อแสดงข้อมูล แต่ แนะนำให้ใช้ CarUiListItemAdapter เมื่อช่องโครงข่ายกำหนด เลย์เอาต์ของรายการสินค้าเพื่อให้ OEM ปรับแต่งได้ การปรับแต่งสำหรับ ListItem จะระบุไว้ในการปรับแต่ง ตัวเลือกของ CarUiListItem

โดยค่าเริ่มต้น ระบบจะใช้ car_ui_scrollbar_margin เป็นความกว้างของมุมมองแถบเลื่อน ขอบนี้ยังเพิ่มเป็น android:endMargin ของ CarUiRecyclerView ด้วย ข้อมูลมีส่วนต่างกำไรเท่ากันที่จุดเริ่มต้นและจุดสิ้นสุด หากนักพัฒนาซอฟต์แวร์ใช้ enableDivider=true จากนั้น OEM จะควบคุมลักษณะที่ตัวแบ่งควรปรากฏขึ้นได้ ขนาดที่ปรับเปลี่ยนได้สําหรับ CarUiRecyclerView ได้มีดังนี้

  <dimen name="car_ui_recyclerview_divider_height">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_start_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_end_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_top_margin">0dp</dimen>
  <dimen name="car_ui_recyclerview_divider_bottom_margin">0dp</dimen>

แถบเลื่อน

มีการกำหนดไฟล์เลย์เอาต์สำหรับแถบเลื่อน CarUiRV ใน car_ui_recyclerview_scrollbar.xml โดยรวมแล้ว มุมมองทั้ง 4 มุมมอง ที่กำหนดไว้ในข้อมูลพร็อพเพอร์ตี้

ยอดดู
`Car_ui_scrollbar_page_up`	กำหนดปุ่มขึ้นของแถบเลื่อน
`Car_ui_scrollbar_page_down`	กำหนดปุ่มลงของแถบเลื่อน
`Car_ui_scrollbar_thumb`	ความสูงจะคำนวณแบบไดนามิก โดยขึ้นอยู่กับจำนวนรายการในองค์ประกอบ Recycler View (RV)
`Car_ui_scrollbar_track`	ความสูงรวมที่กำหนดขอบเขตที่นิ้วโป้งจะขยับ

OEM ควรวางซ้อนไฟล์เลย์เอาต์นี้เพื่อปรับแต่งแถบเลื่อน มุมมองแทร็กควรเป็น วางไว้อย่างระมัดระวังเพื่อกำหนดขอบเขตที่นิ้วโป้งจะขยับ ความสูงของนิ้วโป้งจะคำนวณแบบไดนามิกโดยอิงตามรายการในรถบ้านและความสูง ของผู้รับชม

เลย์เอาต์นี้มีอยู่ในคอนเทนเนอร์ CarUiRV car_ui_recycler_view.xml เฉพาะในกรณีที่ car_ui_scrollbar_enable คือ true

มิติข้อมูลอื่นๆ ที่แถบเลื่อนปรับได้มีดังนี้

  <dimen name="car_ui_scrollbar_container_width">@dimen/car_ui_margin</dimen>
  <dimen name="car_ui_scrollbar_button_size">@dimen/car_ui_touch_target_width</dimen>
  <dimen name="car_ui_scrollbar_thumb_width">7dp</dimen>
  <dimen name="car_ui_scrollbar_separator_margin">16dp</dimen>
  <dimen name="car_ui_scrollbar_margin">@dimen/car_ui_margin</dimen>
  <dimen name="car_ui_scrollbar_thumb_radius">100dp</dimen>

  <item name="car_ui_button_disabled_alpha" format="float" type="dimen">0.2</item>
  <item name="car_ui_scrollbar_milliseconds_per_inch" format="float" type="dimen">150.0</item>
  <item name="car_ui_scrollbar_deceleration_times_divisor" format="float" type="dimen">0.45</item>
  <item name="car_ui_scrollbar_decelerate_interpolator_factor" format="float" type="dimen">1.8</item>

  <dimen name="car_ui_scrollbar_padding_start">0dp</dimen>
  <dimen name="car_ui_scrollbar_padding_end">0dp</dimen>

ตัวอย่าง

ตัวอย่างเช่น หากต้องการนำทั้งลูกศรขึ้นและลงมาไว้ด้วยกันที่ด้านล่างของหน้าจอ ให้ทำดังนี้

การวางซ้อน car_ui_recyclerview_scrollbar.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/car_ui_margin"
    android:layout_height="match_parent"
    android:id="@+id/car_ui_scroll_bar">

    <!-- View height is dynamically calculated during layout. -->
    <View
        android:id="@+id/car_ui_scrollbar_thumb"
        android:layout_width="7dp"
        android:layout_height="20dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:background="@drawable/car_ui_recyclerview_scrollbar_thumb"/>

    <View
        android:id="@+id/car_ui_scrollbar_track"
        android:layout_width="10dp"
        android:layout_height="match_parent"
        android:layout_marginTop="10dp"
        android:layout_centerHorizontal="true"
        android:layout_above="@+id/car_ui_scrollbar_page_up"/>

    <ImageView
        android:id="@+id/car_ui_scrollbar_page_up"
        android:layout_width="76dp"
        android:layout_height="76dp"
        android:focusable="false"
        android:hapticFeedbackEnabled="false"
        android:src="@drawable/car_ui_recyclerview_ic_up"
        android:scaleType="centerInside"
        android:layout_centerHorizontal="true"
        android:layout_above="@+id/car_ui_scrollbar_page_down"/>

    <ImageView
        android:id="@+id/car_ui_scrollbar_page_down"
        android:layout_width="76dp"
        android:layout_height="76dp"
        android:focusable="false"
        android:hapticFeedbackEnabled="false"
        android:src="@drawable/car_ui_recyclerview_ic_down"
        android:scaleType="centerInside"
        android:layout_centerHorizontal="true"
      android:layout_alignParentBottom="true"/>
</RelativeLayout>

หากต้องการกำหนดทรัพยากรที่จะซ้อนทับด้วย RRO ให้เพิ่ม Overlays.xml ดังนี้

<overlay>
    <item target="id/car_ui_scroll_bar" value="@id/car_ui_scroll_bar"/>
    <item target="id/car_ui_scrollbar_thumb" value="@id/car_ui_scrollbar_thumb"/>
    <item target="id/car_ui_scrollbar_track" value="@id/car_ui_scrollbar_track"/>
    <item target="id/car_ui_scrollbar_page_up" value="@id/car_ui_scrollbar_page_up"/>
    <item target="id/car_ui_scrollbar_page_down" value="@id/car_ui_scrollbar_page_down"/>
    <item target="layout/car_ui_recyclerview_scrollbar" value="@layout/car_ui_recyclerview_scrollbar"/>
</overlay>

หากต้องอัปเดตปุ่มปุ่ม ปุ่มลง ปุ่มกด หรือไอคอนนิ้วหัวแม่มือ ปุ่มเหล่านั้นควรวางซ้อนอยู่เช่นกัน
หากมีการใช้ทรัพยากรใหม่ในแพ็กเกจ RRO ที่ยังไม่มีอยู่แล้ว ทรัพยากรเหล่านี้ควรกำหนดไว้ใน RRO APK ที่คุณสร้าง