chore: Improve the UI for event create (center the card)
This commit is contained in:
parent
f7b02b5b20
commit
11e3625d26
GPG key ID:
8CFC3837052871B4
|
|
@ -1,201 +1,207 @@
|
|||
<com.google.android.material.card.MaterialCardView
|
||||
<FrameLayout
|
||||
xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||
xmlns:tools="http://schemas.android.com/tools"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_margin="16dp"
|
||||
android:padding="16dp"
|
||||
app:cardCornerRadius="8dp"
|
||||
app:cardElevation="4dp">
|
||||
android:layout_height="match_parent">
|
||||
|
||||
<LinearLayout
|
||||
android:id="@+id/main"
|
||||
android:layout_margin="15dp"
|
||||
<com.google.android.material.card.MaterialCardView
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:orientation="vertical">
|
||||
android:layout_margin="16dp"
|
||||
android:layout_gravity="center"
|
||||
android:padding="16dp"
|
||||
app:cardCornerRadius="8dp"
|
||||
app:cardElevation="4dp">
|
||||
|
||||
<!-- Event Title -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:hint="@string/event_title"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/etEventTitle"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:textSize="16sp" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Event Description -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="8dp"
|
||||
android:hint="@string/event_description"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/etEventDescription"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:inputType="textMultiLine"
|
||||
android:maxLines="3"
|
||||
android:textSize="16sp" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Event Type Toggle -->
|
||||
<com.google.android.material.button.MaterialButtonToggleGroup
|
||||
android:id="@+id/eventTypeToggleGroup"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_gravity="center"
|
||||
app:singleSelection="true"
|
||||
app:checkedButton="@id/btnInstantEvent">
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnInstantEvent"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/instant_event"
|
||||
android:checkable="true"
|
||||
app:backgroundTint="@color/toggle_button_background_selector"
|
||||
app:strokeColor="@color/toggle_button_stroke_selector"
|
||||
app:strokeWidth="2dp" />
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnDurationEvent"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/duration_event"
|
||||
android:checkable="true"
|
||||
app:backgroundTint="@color/toggle_button_background_selector"
|
||||
app:strokeColor="@color/toggle_button_stroke_selector"
|
||||
app:strokeWidth="2dp" />
|
||||
</com.google.android.material.button.MaterialButtonToggleGroup>
|
||||
|
||||
<!-- Start Time -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:hint="@string/start_time"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/txtStartTime"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:focusable="false"
|
||||
android:clickable="true" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- End Time -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="8dp"
|
||||
android:hint="@string/end_time"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/txtEndTime"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:focusable="false"
|
||||
android:clickable="true"
|
||||
android:visibility="gone"
|
||||
tools:visibility="visible" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Color Picker -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnColorPicker"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:text="@string/select_color"
|
||||
app:icon="@drawable/ic_circle"
|
||||
app:iconTint="@color/event_indicator_color"
|
||||
app:cornerRadius="8dp"
|
||||
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
|
||||
|
||||
<!-- Categories Section -->
|
||||
<LinearLayout
|
||||
android:id="@+id/main"
|
||||
android:layout_margin="15dp"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:orientation="horizontal"
|
||||
android:gravity="center_vertical">
|
||||
android:orientation="vertical">
|
||||
|
||||
<ViewSwitcher
|
||||
android:id="@+id/categoryViewSwitcher"
|
||||
android:layout_width="0dp"
|
||||
<!-- Event Title -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"
|
||||
android:animateFirstView="true">
|
||||
android:hint="@string/event_title"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<!-- RecyclerView for categories -->
|
||||
<androidx.recyclerview.widget.RecyclerView
|
||||
android:id="@+id/categoryChipRecyclerView"
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/etEventTitle"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
tools:listitem="@layout/item_removable_category_chip"
|
||||
tools:itemCount="3"
|
||||
tools:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
|
||||
tools:orientation="horizontal" />
|
||||
android:textSize="16sp" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Placeholder Text, when there aren't any categories -->
|
||||
<TextView
|
||||
android:id="@+id/txtPlaceholder"
|
||||
<!-- Event Description -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="8dp"
|
||||
android:hint="@string/event_description"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/etEventDescription"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:gravity="center"
|
||||
android:padding="8dp"
|
||||
android:text="@string/add_category"
|
||||
android:textAppearance="?attr/textAppearanceBody1"
|
||||
android:textColor="?attr/colorOnSurface" />
|
||||
</ViewSwitcher>
|
||||
android:inputType="textMultiLine"
|
||||
android:maxLines="3"
|
||||
android:textSize="16sp" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Add Button -->
|
||||
<ImageButton
|
||||
android:id="@+id/btnAddCategory"
|
||||
android:layout_width="40dp"
|
||||
android:layout_height="40dp"
|
||||
android:background="?attr/selectableItemBackgroundBorderless"
|
||||
android:src="@drawable/ic_add"
|
||||
app:tint="?attr/colorPrimary"
|
||||
android:contentDescription="@string/add_category" />
|
||||
<!-- Event Type Toggle -->
|
||||
<com.google.android.material.button.MaterialButtonToggleGroup
|
||||
android:id="@+id/eventTypeToggleGroup"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:layout_gravity="center"
|
||||
app:singleSelection="true"
|
||||
app:checkedButton="@id/btnInstantEvent">
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnInstantEvent"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/instant_event"
|
||||
android:checkable="true"
|
||||
app:backgroundTint="@color/toggle_button_background_selector"
|
||||
app:strokeColor="@color/toggle_button_stroke_selector"
|
||||
app:strokeWidth="2dp" />
|
||||
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnDurationEvent"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:text="@string/duration_event"
|
||||
android:checkable="true"
|
||||
app:backgroundTint="@color/toggle_button_background_selector"
|
||||
app:strokeColor="@color/toggle_button_stroke_selector"
|
||||
app:strokeWidth="2dp" />
|
||||
</com.google.android.material.button.MaterialButtonToggleGroup>
|
||||
|
||||
<!-- Start Time -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:hint="@string/start_time"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/txtStartTime"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:focusable="false"
|
||||
android:clickable="true" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- End Time -->
|
||||
<com.google.android.material.textfield.TextInputLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="8dp"
|
||||
android:hint="@string/end_time"
|
||||
app:boxStrokeWidth="1dp"
|
||||
app:boxStrokeColor="?attr/colorPrimary">
|
||||
|
||||
<com.google.android.material.textfield.TextInputEditText
|
||||
android:id="@+id/txtEndTime"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:focusable="false"
|
||||
android:clickable="true"
|
||||
android:visibility="gone"
|
||||
tools:visibility="visible" />
|
||||
</com.google.android.material.textfield.TextInputLayout>
|
||||
|
||||
<!-- Color Picker -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnColorPicker"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:text="@string/select_color"
|
||||
app:icon="@drawable/ic_circle"
|
||||
app:iconTint="@color/event_indicator_color"
|
||||
app:cornerRadius="8dp"
|
||||
style="@style/Widget.MaterialComponents.Button.OutlinedButton"/>
|
||||
|
||||
<!-- Categories Section -->
|
||||
<LinearLayout
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="16dp"
|
||||
android:orientation="horizontal"
|
||||
android:gravity="center_vertical">
|
||||
|
||||
<ViewSwitcher
|
||||
android:id="@+id/categoryViewSwitcher"
|
||||
android:layout_width="0dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_weight="1"
|
||||
android:animateFirstView="true">
|
||||
|
||||
<!-- RecyclerView for categories -->
|
||||
<androidx.recyclerview.widget.RecyclerView
|
||||
android:id="@+id/categoryChipRecyclerView"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
tools:listitem="@layout/item_removable_category_chip"
|
||||
tools:itemCount="3"
|
||||
tools:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
|
||||
tools:orientation="horizontal" />
|
||||
|
||||
<!-- Placeholder Text, when there aren't any categories -->
|
||||
<TextView
|
||||
android:id="@+id/txtPlaceholder"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:gravity="center"
|
||||
android:padding="8dp"
|
||||
android:text="@string/add_category"
|
||||
android:textAppearance="?attr/textAppearanceBody1"
|
||||
android:textColor="?attr/colorOnSurface" />
|
||||
</ViewSwitcher>
|
||||
|
||||
<!-- Add Button -->
|
||||
<ImageButton
|
||||
android:id="@+id/btnAddCategory"
|
||||
android:layout_width="40dp"
|
||||
android:layout_height="40dp"
|
||||
android:background="?attr/selectableItemBackgroundBorderless"
|
||||
android:src="@drawable/ic_add"
|
||||
app:tint="?attr/colorPrimary"
|
||||
android:contentDescription="@string/add_category" />
|
||||
|
||||
</LinearLayout>
|
||||
|
||||
<!-- Create Button -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnCreateEvent"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="24dp"
|
||||
android:text="@string/create_event"
|
||||
app:cornerRadius="8dp" />
|
||||
|
||||
<!-- Close Button -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnClose"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="5dp"
|
||||
android:text="@string/cancel"
|
||||
app:icon="@drawable/ic_arrow_back"
|
||||
app:iconGravity="textStart"
|
||||
app:iconPadding="8dp"
|
||||
style="@style/Widget.MaterialComponents.Button.OutlinedButton" />
|
||||
</LinearLayout>
|
||||
|
||||
<!-- Create Button -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnCreateEvent"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="24dp"
|
||||
android:text="@string/create_event"
|
||||
app:cornerRadius="8dp" />
|
||||
|
||||
<!-- Close Button -->
|
||||
<com.google.android.material.button.MaterialButton
|
||||
android:id="@+id/btnClose"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginTop="5dp"
|
||||
android:text="@string/cancel"
|
||||
app:icon="@drawable/ic_arrow_back"
|
||||
app:iconGravity="textStart"
|
||||
app:iconPadding="8dp"
|
||||
style="@style/Widget.MaterialComponents.Button.OutlinedButton" />
|
||||
</LinearLayout>
|
||||
</com.google.android.material.card.MaterialCardView>
|
||||
</com.google.android.material.card.MaterialCardView>
|
||||
</FrameLayout>
|
||||
Loading…
Reference in a new issue