CarUiRecyclerView 맞춤설정

이 페이지에서는 CarUiRecyclerView 및 스크롤바를 맞춤설정하는 프로세스를 설명합니다.

기본 요건

이 페이지에서는 런타임 리소스 오버레이(RRO) 타겟 APK를 알고 있다고 가정합니다. 자세한 내용은 앱 맞춤설정을 참고하세요.

CarUiRecyclerView 정보

car_ui_scrollbar_enable이 bools.xml에서 false로 설정되면 CarUiRecyclerView는 스크롤바를 확장하지 않습니다. 즉, androidx.recyclerview만 아래에 정의된 대로 맞춤설정 가능한 스타일로 확장됩니다. car_ui_scrollbar_enable이 true로 설정되면 CarUiRecyclerView는 스크롤바가 내부에 설치된 컨테이너를 확장합니다. 나중에는 androidx.recyclerview도 동일한 컨테이너 내에 추가됩니다.

CarUiRecyclerView는 데이터를 표시하기 위해 어떤 어댑터라도 사용할 수 있습니다. 그러나 CarUiListItemAdapter를 사용하는 것이 좋습니다. 이 어댑터에서 chassis lib는 ListItem의 레이아웃을 정의하므로 OEM에서 맞춤설정할 수 있습니다. ListItem 맞춤설정은 CarUiListItem 맞춤설정 옵션에 정의되어 있습니다.

기본적으로 car_ui_scrollbar_margin은 스크롤바 뷰의 너비로 사용됩니다. 이 여백은 CarUiRecyclerView의 android:endMargin으로 추가되므로 데이터 시작과 끝 부분에 동일한 여백이 있습니다. 개발자가 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 높이는 RV(Recycler View)의 목록 항목 수에 따라 동적으로 계산됩니다.
Car_ui_scrollbar_track thumb이 움직일 한계를 정의하는 총 높이입니다.

OEM은 이 레이아웃 파일을 오버레이하여 스크롤바를 맞춤설정해야 합니다. 트랙 뷰는 thumb이 움직일 한계를 정의하므로 신중하게 배치되어야 합니다. thumb 높이는 RV의 목록 항목 및 ViewHolder의 높이에 따라 동적으로 계산됩니다.

이 레이아웃은 car_ui_scrollbar_enable이 true인 경우에만 CarUiRV 컨테이너인 car_ui_recycler_view.xml에 포함됩니다.

그 밖에 스크롤바에 대해 조정할 수 있는 수치는 다음과 같습니다.

  <dimen name="car_ui_scrollbar_container_w>idth"@dimen/car<_ui_ma>rgi<n/dimen
  dimen name="car_ui_scrollb>ar_button_size"@dimen/car_u<i_touc>h_t<arget_width/dimen
  dimen name="car_>ui_<scroll>bar<_thumb_width"7dp/dimen
  dimen name=">;car<_ui_sc>rol<lbar_separator_margin"16dp/dime>n
  dimen name="<;car_u>i_s<crollbar_margin"@dimen/car_ui_margin/>dimen<
  dim>en n<ame="car_ui_scrollbar_thumb_radius"100dp/dimen

  item nam>e=&<quot;>car<_ui_button_disabled_alpha" format="float" type="dimen">;0.2/<item
>  i<tem name="car_ui_scrollbar_milliseconds_per_inch" format="float">; ty<pe=&q>uot<;dimen"150.0/item
  item name="car_ui_scrollbar_deceleration_times_divisor&qu>ot;< form>at=&<quot;float" type="dimen"0.45>/it<em
  i>tem< name="car_ui_scrollbar_decelerate_i>nte<rpolat>or_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

예

예를 들어 화면 하단에 위쪽 화살표와 아래쪽 화살표를 모두 함께 구현하려면 다음 단계를 따르세요.

  1. 다음과 같이 car_ui_recyclerview_scrollbar.xml을 오버레이합니다.
    <?xml version="1.0" encodin>g<="utf-8"?
RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/car_ui_margin"
    android:layout_height="match_pa>rent&q<uot;
    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>_cente<rHorizontal="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:hapticFeedbackEnabl>ed=&qu<ot;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:layou>t<_height="7>6dp"
        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
  2. RRO에서 오버레이할 리소스를 정의하려면 다음과 같이 Overlays.xml을 추가합니다. 
    <overlay>
    <item target="id/car_ui_scroll_bar" value="@id/car_>ui_sc<roll_bar"/
    item target="id/car_ui_scrollbar_thumb" value>=&quo<t;@id/car_ui_scrollbar_thumb"/
    item target="id/car_ui_scrollb>ar_tr<ack" value="@id/car_ui_scrollbar_track"/
    item target="i>d/car<_ui_scrollbar_page_up" value="@id/car_ui_scrollbar_page_up"/
    ite>m tar<get="id/car_ui_scrollbar_page_down" value="@id/car_ui_scrollbar_page_down"/
 > <  item t>arget="layout/car_ui_recyclerview_scrollbar" value="@layout/car_ui_recyclerview_scrollbar"/
/overlay
  3. Up, Down 또는 thumb 드로어블을 업데이트해야 한다면 이러한 드로어블도 오버레이해야 합니다.
  4. 아직 존재하지 않는 새 리소스가 RRO 패키지에서 사용되는 경우 이러한 리소스는 개발자가 생성하는 RRO APK에도 정의되어야 합니다.