Skip to content

Commit

Permalink
[Catalog][TimePicker] Add input mode selector
Browse files Browse the repository at this point in the history 
Resolves #2902

GIT_ORIGIN_REV_ID=3d62554886116fba051d8030a731678f3d181d30
Co-authored-by: paulfthomas
PiperOrigin-RevId: 474614468
  • Loading branch information
@pubiqq @afohrman
pubiqq authored and afohrman committed Sep 16, 2022
1 parent ab063b7 commit 09f1ee5
Show file tree
Hide file tree
Showing 3 changed files with 161 additions and 25 deletions.
68 changes: 55 additions & 13 deletions catalog/java/io/material/catalog/timepicker/TimePickerMainDemoFragment.java
View file
Expand Up @@ -17,9 +17,15 @@

import io.material.catalog.R;

import static com.google.android.material.timepicker.MaterialTimePicker.INPUT_MODE_CLOCK;
import static com.google.android.material.timepicker.MaterialTimePicker.INPUT_MODE_KEYBOARD;
import static com.google.android.material.timepicker.TimeFormat.CLOCK_12H;
import static com.google.android.material.timepicker.TimeFormat.CLOCK_24H;

import android.os.Bundle;
import androidx.appcompat.widget.SwitchCompat;
import android.text.format.DateFormat;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
Expand All @@ -37,11 +43,14 @@
/** A fragment that displays the main Picker demos for the Catalog app. */
public class TimePickerMainDemoFragment extends DemoFragment {

private static final String TAG = TimePickerMainDemoFragment.class.getSimpleName();

private int hour;
private int minute;

private final SimpleDateFormat formatter = new SimpleDateFormat("hh:mm a", Locale.getDefault());
@TimeFormat private int clockFormat;
@Nullable private Integer timeInputMode;
private TextView textView;

@Override
Expand All @@ -51,37 +60,70 @@ public View onCreateDemoView(
ViewGroup view =
(ViewGroup) layoutInflater.inflate(R.layout.time_picker_main_demo, viewGroup, false);

Button button = view.findViewById(R.id.timepicker_button);
textView = view.findViewById(R.id.timepicker_time);
MaterialButtonToggleGroup timeFormatToggle = view.findViewById(R.id.time_format_toggle);
clockFormat = TimeFormat.CLOCK_12H;
timeFormatToggle.check(R.id.time_format_12h);

MaterialButtonToggleGroup timeFormatToggle = view.findViewById(R.id.time_format_toggle);
timeFormatToggle.addOnButtonCheckedListener(
(group, checkedId, isChecked) -> {
if (isChecked) {
boolean isSystem24Hour = DateFormat.is24HourFormat(getContext());
boolean is24Hour =
checkedId == R.id.time_format_24h
|| (checkedId == R.id.time_format_system && isSystem24Hour);
if (checkedId == R.id.time_format_12h) {
clockFormat = CLOCK_12H;
} else if (checkedId == R.id.time_format_24h) {
clockFormat = CLOCK_24H;
} else if (checkedId == R.id.time_format_system) {
boolean isSystem24Hour = DateFormat.is24HourFormat(getContext());
clockFormat = isSystem24Hour ? CLOCK_24H : CLOCK_12H;
} else {
Log.d(TAG, "Invalid time format selection: " + checkedId);
}
}
});

clockFormat = is24Hour ? TimeFormat.CLOCK_24H : TimeFormat.CLOCK_12H;
MaterialButtonToggleGroup timeInputModeToggle = view.findViewById(R.id.time_input_mode_toggle);
timeInputModeToggle.addOnButtonCheckedListener(
(group, checkedId, isChecked) -> {
if (isChecked) {
if (checkedId == R.id.time_input_mode_clock) {
timeInputMode = INPUT_MODE_CLOCK;
} else if (checkedId == R.id.time_input_mode_keyboard) {
timeInputMode = INPUT_MODE_KEYBOARD;
} else if (checkedId == R.id.time_input_mode_default) {
timeInputMode = null;
} else {
Log.d(TAG, "Invalid time input mode selection: " + checkedId);
}
}
});

SwitchCompat frameworkSwitch = view.findViewById(R.id.framework_switch);
frameworkSwitch.setOnCheckedChangeListener((buttonView, isChecked) -> {
for (int i = 0; i < timeInputModeToggle.getChildCount(); i++) {
View child = timeInputModeToggle.getChildAt(i);
child.setEnabled(!isChecked);
}
});

timeFormatToggle.check(R.id.time_format_system);
timeInputModeToggle.check(R.id.time_input_mode_default);
frameworkSwitch.setChecked(false);

Button button = view.findViewById(R.id.timepicker_button);
button.setOnClickListener(v -> {
if (frameworkSwitch.isChecked()) {
showFrameworkTimepicker();
return;
}

MaterialTimePicker materialTimePicker = new MaterialTimePicker.Builder()
MaterialTimePicker.Builder materialTimePickerBuilder = new MaterialTimePicker.Builder()
.setTimeFormat(clockFormat)
.setHour(hour)
.setMinute(minute)
.build();
.setMinute(minute);

if (timeInputMode != null) {
materialTimePickerBuilder.setInputMode(timeInputMode);
}

MaterialTimePicker materialTimePicker = materialTimePickerBuilder.build();
materialTimePicker.show(requireFragmentManager(), "fragment_tag");

materialTimePicker.addOnPositiveButtonClickListener(dialog -> {
Expand All @@ -102,7 +144,7 @@ private void showFrameworkTimepicker() {
TimePickerMainDemoFragment.this.onTimeSet(hourOfDay, minute),
hour,
minute,
clockFormat == TimeFormat.CLOCK_24H);
clockFormat == CLOCK_24H);
timePickerDialog.show();
}

Expand Down
93 changes: 88 additions & 5 deletions catalog/java/io/material/catalog/timepicker/res/layout/time_picker_main_demo.xml
View file
Expand Up @@ -46,17 +46,41 @@
app:layout_constraintStart_toEndOf="@id/timepicker_button"
app:layout_constraintTop_toTopOf="@id/timepicker_button" />

<TextView
android:id="@+id/time_format_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:text="@string/time_format_label"
android:textAlignment="center"
android:textAppearance="?attr/textAppearanceBodyLarge"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

<com.google.android.material.button.MaterialButtonToggleGroup
android:id="@+id/time_format_toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:layout_marginTop="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintTop_toBottomOf="@+id/time_format_label"
app:selectionRequired="true"
app:singleSelection="true">

<Button
android:id="@+id/time_format_system"
style="?attr/materialButtonOutlinedStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/time_format_system" />

<Button
android:id="@+id/time_format_12h"
style="?attr/materialButtonOutlinedStyle"
Expand All @@ -71,12 +95,71 @@
android:layout_height="wrap_content"
android:text="@string/time_format_24" />

</com.google.android.material.button.MaterialButtonToggleGroup>

<TextView
android:id="@+id/time_input_mode_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:text="@string/time_input_mode_label"
android:textAlignment="center"
android:textAppearance="?attr/textAppearanceBodyLarge"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/time_format_toggle" />

<TextView
android:id="@+id/time_input_mode_note"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
android:text="@string/time_input_mode_note"
android:textAlignment="center"
android:textAppearance="?attr/textAppearanceBodySmall"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/time_input_mode_label" />

<com.google.android.material.button.MaterialButtonToggleGroup
android:id="@+id/time_input_mode_toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/time_input_mode_note"
app:selectionRequired="true"
app:singleSelection="true">

<Button
android:id="@+id/time_format_system"
android:id="@+id/time_input_mode_default"
style="?attr/materialButtonOutlinedStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/time_format_system" />
android:text="@string/time_input_mode_default" />

<Button
android:id="@+id/time_input_mode_clock"
style="?attr/materialButtonOutlinedStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/time_input_mode_clock" />

<Button
android:id="@+id/time_input_mode_keyboard"
style="?attr/materialButtonOutlinedStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/time_input_mode_keyboard" />

</com.google.android.material.button.MaterialButtonToggleGroup>

Expand All @@ -88,7 +171,7 @@
android:text="@string/use_framework_dialog"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/time_format_toggle" />
app:layout_constraintTop_toBottomOf="@+id/time_input_mode_toggle" />

</androidx.constraintlayout.widget.ConstraintLayout>

Expand Down
25 changes: 18 additions & 7 deletions catalog/java/io/material/catalog/timepicker/res/values/strings.xml
View file
Expand Up @@ -20,17 +20,28 @@
<string name="cat_time_picker_demo_title">Time Picker</string>
<!-- Description of the catalog demo containing time picker. [CHAR LIMIT=128] -->
<string name="cat_time_picker_description">Time pickers allow users to choose times.</string>
<!-- Label for a time format toggle group [CHAR LIMIT=NONE] -->
<string name="time_format_label">Time format</string>
<!-- Label for an option to choose the 12-hour time format [CHAR LIMIT=16] -->
<string name="time_format_24">24H</string>
<!-- Label for an option to choose the 24-hour time format [CHAR LIMIT=16] -->
<string name="time_format_12">12H</string>
<!-- Label for an option to choose the same time format as the system [CHAR LIMIT=16] -->
<string name="time_format_system">System</string>
<!-- Label for a time input mode toggle group [CHAR LIMIT=NONE] -->
<string name="time_input_mode_label">Time input mode</string>
<!-- Label for an option to choose the default time picker's input mode [CHAR LIMIT=16] -->
<string name="time_input_mode_default">Default</string>
<!-- Label for an option to choose the clock mode as the time picker's input mode [CHAR LIMIT=16] -->
<string name="time_input_mode_clock">Clock</string>
<!-- Label for an option to choose the text input mode as the time picker's input mode [CHAR LIMIT=16] -->
<string name="time_input_mode_keyboard">Keyboard</string>
<!-- Text informing that a time input mode selection is not available for Framework Time Picker [CHAR LIMIT=NONE] -->
<string name="time_input_mode_note">(not available for Framework Time Picker)</string>
<!-- Label for a switch that allows the user to use the framework version of the time picker [CHAR LIMIT=128] -->
<string name="use_framework_dialog">Use Framework Time Picker</string>
<!-- Label for a button to choose the time [CHAR LIMIT=64] -->
<string name="select_time">Select Time</string>
<!-- The default time when entering the fragment [CHAR LIMIT=64] -->
<string name="default_time">12:00 AM</string>
<!-- Label for an option to choose the 12 hour time format [CHAR LIMIT=16] -->
<string name="time_format_24">24H</string>
<!-- Label for an option to choose the 24 hour time format [CHAR LIMIT=16] -->
<string name="time_format_12">12H</string>
<!-- Label for an option to choose the same time format as the system [CHAR LIMIT=16] -->
<string name="time_format_system">System</string>

</resources>

0 comments on commit 09f1ee5

Please sign in to comment.