androiddatepickermaterial-designandroid-datepickermaterial-components-android

How to cut(remove or hide or shrink) the header_title of Material dateRangePicker(Dialog) in Android?


I want to remove the space on top

image

My style theme (stackOverFlow's user answer here)

My code

fun clickDatePicker() {
        setTheme(R.style.AppTheme_MaterailComponent)

        val local = Locale.KOREA
        Locale.setDefault(local)

        val builder = MaterialDatePicker.Builder.dateRangePicker()
        val picker = builder.build()
        picker.apply {
            addOnPositiveButtonClickListener { selection: Pair<Long, Long>? ->
                // just my other logic
                selection?.first?.let { setYearMonthDate(it) }
                    ?.let { it1 -> firstAndSecondMap.put(0, it1) }
                selection?.second?.let { setYearMonthDate(it) }
                    ?.let { it1 -> firstAndSecondMap.put(1, it1) }
                filterDate()
                binding.duration = 0
            }
            show(supportFragmentManager, "picker")
        }
        
}

Solution

  • Currently (1.1.0,1.2.0-beta01,1.3.0-alpha01) there isn't a method to hide the header title.
    It is only a workaround and it can stop working in the next releases.

    In your theme overlay you can set the visibility of the HeaderTitle with:

       <style name="MaterialCalendarTheme" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
            <item name="materialCalendarHeaderTitle">@style/HeaderTitle_Hide</item>
        </style>
    
        <style name="HeaderTitle_Hide" parent="@style/Widget.MaterialComponents.MaterialCalendar.HeaderTitle">
            <item name="android:visibility">gone</item>
        </style>
    

    It is not enough. You have to override these dimens in your project.

    <dimen name="mtrl_calendar_header_height">72dp</dimen>
    <dimen name="mtrl_calendar_selection_text_baseline_to_top">58dp</dimen>
    

    enter image description here