自定义日历日期范围滑动选择 android

Question

我需要设计一个自定义日历来选择日期，同时轻扫它们。我需要一些关于如何在日历上实现滑动的解决方案，如果有任何支持此功能的库也会有所帮助。

我们会考虑任何类型的帮助。谢谢你！滑动日期UI图片如图

Answer 1

由于有很多付费日历，我开发了一个开源的非付费日历，它可以用于 select 日期，同时滑动它们。看起来像这样

参考 SwipeDateCalendar

处的源代码

也可以根据需要进一步修改

Answer 2

使用这个自定义日历，在 build.gradle

implementation 'com.savvi.datepicker:rangepicker:1.2.0'

和xml文件

<com.savvi.rangedatepicker.CalendarPickerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/calendar_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingBottom="16dp"
    android:scrollbarStyle="outsideOverlay"
    android:clipToPadding="false"
    app:tsquare_dividerColor="@color/calendar_bg"
    app:tsquare_headerTextColor="@color/calendar_selected_day_bg"
    />

和java文件

Calendar pastYear = Calendar.getInstance();
        pastYear.add(Calendar.YEAR, -2);
        Calendar nextYear = Calendar.getInstance();
        nextYear.add(Calendar.DATE,1);



CalendarPickerView calendar = (CalendarPickerView) findViewById(R.id.calendar_view);

    calendar.init(pastYear.getTime(), nextYear.getTime()) //
            .inMode(CalendarPickerView.SelectionMode.RANGE)
            .withSelectedDate(new Date());
calendar.setTypeface(Typeface.SANS_SERIF);

https://androidexample365.com/a-calendar-picker-view-to-show-a-customized-date-range-picker-with-improved-ui/

Answer 3

使用 Android 的默认 Material 组件，您可以使用新的 MaterialDatePicker。在其中您可以获得单个日期选择以及日期范围选择。

将以下内容添加到您的 build.gradle

implementation 'com.google.android.material:material:1.2.0 alpha02'

为开放日期范围选择器调用以下方法

private fun setupRangePickerDialog() {
    val builder:MaterialDatePicker.Builder<*> =MaterialDatePicker.Builder.dateRangePicker()
    val constraintsBuilder = CalendarConstraints.Builder()
    try {
        builder.setCalendarConstraints(constraintsBuilder.build())
        val picker:MaterialDatePicker<*> =builder.build()
        getDateRange(picker)
        picker.show(supportFragmentManager, picker.toString())
    } catch (e:IllegalArgumentException){
    }
}

现在把获取开始和结束日期的方法放在下面

private fun getDateRange(materialCalendarPicker:MaterialDatePicker<out Any>) {
    materialCalendarPicker.addOnPositiveButtonClickListener({
            selection:Any ? ->
    Log.e("DateRangeText", materialCalendarPicker.headerText)})
    materialCalendarPicker.addOnNegativeButtonClickListener({
            dialog:View ? ->})
    materialCalendarPicker.addOnCancelListener({
            dialog:DialogInterface ? ->})
}

恭喜，大功告成！

Answer 4

  implementation 'com.google.android.material:material:1.3.0-alpha01'

使用此依赖项添加到您的 build.gradle

这是在按钮上点击设置此代码 :

 MaterialDatePicker.Builder<Pair<Long, Long>> builder = MaterialDatePicker.Builder.dateRangePicker();
            CalendarConstraints.Builder constraintsBuilder = new CalendarConstraints.Builder();
            builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen);
            builder.setCalendarConstraints(constraintsBuilder.build());
            MaterialDatePicker  picker = builder.build();
            assert getFragmentManager() != null;
            picker.show(getFragmentManager(), picker.toString());

添加到您的 style.xml:

 <style name="CustomThemeOverlay_MaterialCalendar_Fullscreen" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
    <item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorOnSurface">@color/colorTextPrimary</item>
</style>

<style name="Custom_MaterialCalendar.Fullscreen" parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
    <item name="android:windowFullscreen">false</item>

</style>

将此添加到您的整个项目样式 Apptheme 中：

  <item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
    <item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item>
    <item name="materialCalendarTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar</item>

自定义日历日期范围滑动选择 android

Custom Calendar Date range swipe selection android

android

calendar

android-calendar