如何在recyclerview android中添加时间段

Question

我有recyclerview a，所有时间都会显示。我想显示插槽类型。我应该使用任何库来编码这样的布局吗？或者我们可以在我们的 xml 本身中做。 请有人推荐我

activity_booking_calender.xml

   <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/white"
android:orientation="vertical">

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/margin_large"
    android:orientation="horizontal"
    android:visibility="gone">


    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:text="Select Date &amp; Time"

        android:textColor="@color/black_updated"

        android:textStyle="bold" />
</RelativeLayout>

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/startdate_enddate_text_margin_top"
    android:orientation="horizontal">

    <RelativeLayout
        android:id="@+id/relative_start_date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_gravity="start|center"
        android:gravity="start|center"
        android:orientation="vertical"
        android:layout_alignParentLeft="true">

        <TextView
            android:layout_marginLeft="20dp"
            android:id="@+id/txt_start_date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginBottom="@dimen/startdate_enddate_text_margin_bottom"
            android:fontFamily="@font/inter_regular"
            android:gravity="center"
            android:text="START TIME"

            android:textColor="@color/text_grey"
            android:textSize="@dimen/startdate_enddate_text"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_marginLeft="20dp"
            android:id="@+id/linear_start_date"
            android:clickable="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/txt_start_date"
            android:background="@drawable/btn_grey_background_no_stroke"
            android:orientation="horizontal"
            android:paddingTop="@dimen/motorcycle_date_text_top"
            android:paddingBottom="@dimen/motorcycle_date_text_bottom">

            <ImageView
                android:layout_width="@dimen/motorcycle_date_icon_width"
                android:layout_height="@dimen/motorcycle_date_icon_height"
                android:layout_gravity="center"
                android:layout_marginStart="@dimen/motorcycle_date_icon_start"
                android:src="@drawable/ic_calendar_white"
                android:layout_marginLeft="@dimen/motorcycle_date_icon_start" />

            <TextView

                android:id="@+id/txt_select_from_date"
                android:layout_width="90dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginStart="@dimen/motorcycle_date_text_start"
                android:layout_marginEnd="@dimen/motorcycle_date_text_end"
                android:fontFamily="@font/inter_regular"
                android:gravity="center"
                android:lineSpacingExtra="14.0sp"
                android:text=""
                android:textColor="#ffffffff"
                android:textSize="@dimen/motorcycle_date_text"
                android:layout_marginRight="@dimen/motorcycle_date_text_end"
                android:layout_marginLeft="@dimen/motorcycle_date_text_start" />
        </LinearLayout>
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/relative_end_date"
        android:layout_width="wrap_content"
        android:clickable="true"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_alignParentRight="true"
        android:layout_gravity="end|center"
        android:gravity="end|center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/txt_end_date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginBottom="@dimen/startdate_enddate_text_margin_bottom"
            android:fontFamily="@font/inter_regular"
            android:gravity="center"
            android:text="END TIME"
            android:textColor="@color/text_grey"
            android:textSize="@dimen/startdate_enddate_text"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/txt_end_date"
            android:background="@drawable/btn_grey_background_no_stroke"
            android:orientation="horizontal"
            android:paddingTop="@dimen/motorcycle_date_text_top"
            android:paddingBottom="@dimen/motorcycle_date_text_bottom">

            <ImageView
                android:layout_width="@dimen/motorcycle_date_icon_width"
                android:layout_height="@dimen/motorcycle_date_icon_height"
                android:layout_gravity="center"
                android:layout_marginStart="@dimen/motorcycle_date_icon_start"
                android:src="@drawable/ic_calendar_white"
                android:layout_marginLeft="@dimen/motorcycle_date_icon_start" />

            <TextView
                android:id="@+id/txt_to_date"
                android:layout_width="90dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginStart="@dimen/motorcycle_date_text_start"
                android:layout_marginEnd="@dimen/motorcycle_date_text_end"
                android:fontFamily="@font/inter_regular"
                android:gravity="center"
                android:lineSpacingExtra="14.0sp"
                android:text=""
                android:textColor="#ffffffff"
                android:textSize="@dimen/motorcycle_date_text"
                android:layout_marginLeft="@dimen/motorcycle_date_text_start"
                android:layout_marginRight="@dimen/motorcycle_date_text_end" />
        </LinearLayout>
    </RelativeLayout>

</RelativeLayout>

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">


        <TextView
            android:id="@+id/txt_time_select"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:layout_gravity="center"
            android:layout_marginTop="3dp"
            android:gravity="center"
            android:lineSpacingExtra="14.0sp"
            android:padding="7.0dip"

            android:text="Please Select the Minimum booking of 2 hours"
            android:textAlignment="center"
            android:textColor="#ff4e44d8"

            android:textSize="14dp"


            />

        <com.prolificinteractive.materialcalendarview.MaterialCalendarView xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/calendarView"
            android:layout_width="fill_parent"
            android:layout_height="0.0dip"
            android:layout_below="@+id/linear_time_type"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center"
            android:layout_margin="@dimen/margin_small"
            android:layout_weight="0.5"

            app:mcv_allowClickDaysOutsideCurrentMonth="true"


            app:mcv_arrowColor="#7EA2FA"
            app:mcv_selectionColor="#ff4e44d8" />

        <View
            android:id="@+id/divider"
            android:layout_width="fill_parent"
            android:layout_height="1.0dip"
            android:layout_below="@+id/calendarView"
            android:background="@color/divider" />

        <RelativeLayout
            android:id="@+id/relative_list_time_slots"
            android:layout_width="fill_parent"
            android:layout_height="0.0dip"
            android:layout_below="@+id/divider"
            android:layout_weight="0.5">

            <LinearLayout
                android:id="@+id/linear_progress_wave"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:gravity="center"
                android:orientation="vertical"
                android:visibility="gone" />
            <RelativeLayout
                android:id="@+id/txt_pick_drop_RR"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                <TextView
                    android:id="@+id/txt_pick_up_drop"
                    android:text="Select Pick Up Time"
                    android:gravity="center"
                    android:textColor="#ff4e44d8"
                    android:textSize="16dp"
                    android:fontFamily="@font/inter_medium"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                </TextView>
            </RelativeLayout>

            <androidx.recyclerview.widget.RecyclerView
                android:layout_below="@+id/txt_pick_drop_RR"
                android:id="@+id/recyclerView_timeSlots"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginStart="@dimen/margin_small"
                android:layout_marginTop="@dimen/margin_small"
                android:layout_marginEnd="@dimen/margin_small"
                android:layout_marginBottom="50.0dip"
                android:scrollbars="horizontal"
                android:visibility="visible" />

            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/recyclerView_timeSlots_next"
                android:layout_below="@+id/txt_pick_drop_RR"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_marginStart="@dimen/margin_small"
                android:layout_marginTop="@dimen/margin_small"
                android:layout_marginEnd="@dimen/margin_small"
                android:layout_marginBottom="50.0dip"
                android:scrollbars="horizontal"
                android:visibility="gone" />
        </RelativeLayout>
    </LinearLayout>

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@+id/layout_actionbtns"
        android:layout_margin="5.0dip"
        android:gravity="bottom|center|right"
        android:text="Indian Standard Time"
        android:textColor="@color/light_gray"
        android:textSize="10.0dip" />

    <LinearLayout
        android:id="@+id/layout_actionbtns"
        android:layout_width="fill_parent"
        android:layout_height="@dimen/common_btn_height"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal">

        <LinearLayout
            android:layout_marginLeft="10dp"
            android:id="@+id/btn_cancel"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_gravity="center"
            android:layout_weight="0.5"
            android:background="@drawable/ripple_next_button"
            android:clickable="true"
            android:foreground="@drawable/ic_ripple_white"
            android:gravity="center">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:gravity="center">

                <ImageView
                    android:layout_width="17.0dip"
                    android:layout_height="17.0dip"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_wrong" />
            </LinearLayout>

            <TextView
                android:id="@+id/txt_cancel"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:layout_marginLeft="10.0dip"
                android:gravity="center"
                android:text="Cancel"

                android:textColor="@color/white"
                android:textSize="18.0dip"
                android:textStyle="bold" />
        </LinearLayout>

        <View
            android:layout_width="10.0dip"
            android:layout_height="fill_parent"
            android:background="@color/white" />

        <LinearLayout
            android:layout_marginRight="10dp"
            android:id="@+id/btn_done"

            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_gravity="center"
            android:layout_weight="0.5"


            android:background="@drawable/ripple_next_button"
            android:clickable="true"



            android:foreground="@drawable/ic_ripple_white"
            android:focusable="true"

            android:gravity="center">

            <LinearLayout



                android:layout_width="wrap_content"
                android:layout_height="fill_parent"
                android:layout_gravity="center"


                android:gravity="center">

                <ImageView

                    android:layout_width="20.0dip"
                    android:layout_height="20.0dip"
                    android:layout_gravity="center"

                    android:src="@drawable/ic_tick" />
            </LinearLayout>

            <TextView
                android:id="@+id/txt_done"

                android:layout_width="wrap_content"
                android:layout_height="fill_parent"


                android:layout_gravity="center"

                android:layout_marginLeft="10.0dip"
                android:layout_marginRight="16.0dip"


                android:fontFamily="@font/inter_medium"
                android:gravity="center"
                android:minHeight="0.0dip"
                android:paddingStart="10.0dip"
                android:paddingEnd="10.0dip"
                android:text="NEXT"
                android:textColor="@color/white"
                android:textSize="16.0sp" />


        </LinearLayout>
    </LinearLayout>



</RelativeLayout>

这里是我的 Recycler 视图 xml 文件。我想我们必须在这里修改以获得像时隙这样的布局。 但不知道怎么做。

time_slot_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"

android:background="?android:attr/selectableItemBackground"
android:layout_height="wrap_content">

<TextView
    android:layout_width="match_parent"

   android:textAlignment="center"
    android:textSize="20dp"
    android:id="@+id/time_slot"
    android:layout_height="35dp">

</TextView>

Answer 1

这取决于您想要实现的用户体验。另外，您不需要任何外部库来实现此 UX。

在这种情况下，您可以使用默认的号码选择器。

在 XMX 中：

 <NumberPicker
       android:id="@+id/slot_picker" 
       android:layout_width="match_parent"
       android:layout_height="wrap_content"/>

在活动中：

private NumberPicker picker1;
@Override. 
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
picker1 = findViewById(R.id.numberpicker_main_picker);
}

NumberPicker 将一个字符串数组作为其值。首先，创建一个字符串数组的实例变量，然后用你想要的值初始化这个数组。

private String[] pickerVals;
pickerVals = new String[] {"slot 1","slot 2","slot 3","slot 4","slot 5"}
picker1.setDisplayedValues(pickerVals);

Number Picker

Refered from this Example

Answer 2

您可以使用 Android 原生小部件 - NumberPicker。这允许您从预定义的范围中选择一个数字。 https://stackoverflow.com/a/39662187/5742882

对于动态更新， 了解https://github.com/drawers/SpinnerDatePicker的要点。

这也使用了具有正确日期格式的 NumberPicker。