Implement PN mode bottom sheet UI
parent
c09032900f
commit
6d4398e740
@ -0,0 +1,118 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<LinearLayout
|
||||||
|
xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
|
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:gravity="center_horizontal"
|
||||||
|
app:behavior_hideable="true"
|
||||||
|
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
|
||||||
|
android:background="@drawable/default_bottom_sheet_background_inset">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/medium_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:textSize="@dimen/very_large_font_size"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="6dp"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:textSize="@dimen/medium_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_explanation" />
|
||||||
|
|
||||||
|
<LinearLayout
|
||||||
|
android:id="@+id/fcmOptionView"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/medium_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:padding="12dp"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:background="@drawable/pn_option_background">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:textSize="@dimen/medium_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_fcm_option_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_fcm_option_explanation" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/accent"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_recommended_option_tag" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
||||||
|
|
||||||
|
<LinearLayout
|
||||||
|
android:id="@+id/backgroundPollingOptionView"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/small_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:padding="12dp"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:background="@drawable/pn_option_background">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:textSize="@dimen/medium_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_background_polling_option_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_background_polling_option_explanation" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
style="@style/MediumProminentOutlineButton"
|
||||||
|
android:id="@+id/confirmButton"
|
||||||
|
android:layout_width="240dp"
|
||||||
|
android:layout_height="@dimen/medium_button_height"
|
||||||
|
android:layout_marginTop="@dimen/medium_spacing"
|
||||||
|
android:text="@string/sheet_pn_mode_confirm_button_title" />
|
||||||
|
|
||||||
|
<Button
|
||||||
|
style="@style/MediumUnimportantOutlineButton"
|
||||||
|
android:id="@+id/skipButton"
|
||||||
|
android:layout_width="240dp"
|
||||||
|
android:layout_height="@dimen/medium_button_height"
|
||||||
|
android:layout_marginTop="@dimen/small_spacing"
|
||||||
|
android:layout_marginBottom="@dimen/medium_spacing"
|
||||||
|
android:text="@string/sheet_pn_mode_skip_button_title" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
@ -0,0 +1,118 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<LinearLayout
|
||||||
|
xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
|
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:gravity="center_horizontal"
|
||||||
|
app:behavior_hideable="true"
|
||||||
|
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
|
||||||
|
android:background="@drawable/default_bottom_sheet_background_inset">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/medium_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:textSize="@dimen/large_font_size"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="6dp"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:textSize="@dimen/small_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_explanation" />
|
||||||
|
|
||||||
|
<LinearLayout
|
||||||
|
android:id="@+id/fcmOptionView"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/small_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:padding="12dp"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:background="@drawable/pn_option_background">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:textSize="@dimen/medium_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_fcm_option_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_fcm_option_explanation" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/accent"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_recommended_option_tag" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
||||||
|
|
||||||
|
<LinearLayout
|
||||||
|
android:id="@+id/backgroundPollingOptionView"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginLeft="@dimen/very_large_spacing"
|
||||||
|
android:layout_marginTop="@dimen/small_spacing"
|
||||||
|
android:layout_marginRight="@dimen/very_large_spacing"
|
||||||
|
android:padding="12dp"
|
||||||
|
android:orientation="vertical"
|
||||||
|
android:background="@drawable/pn_option_background">
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:textSize="@dimen/medium_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:textStyle="bold"
|
||||||
|
android:text="@string/sheet_pn_mode_background_polling_option_title" />
|
||||||
|
|
||||||
|
<TextView
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:layout_marginTop="4dp"
|
||||||
|
android:textSize="@dimen/very_small_font_size"
|
||||||
|
android:textColor="@color/text"
|
||||||
|
android:text="@string/sheet_pn_mode_background_polling_option_explanation" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
style="@style/MediumProminentOutlineButton"
|
||||||
|
android:id="@+id/confirmButton"
|
||||||
|
android:layout_width="240dp"
|
||||||
|
android:layout_height="@dimen/medium_button_height"
|
||||||
|
android:layout_marginTop="10dp"
|
||||||
|
android:text="@string/sheet_pn_mode_confirm_button_title" />
|
||||||
|
|
||||||
|
<Button
|
||||||
|
style="@style/MediumUnimportantOutlineButton"
|
||||||
|
android:id="@+id/skipButton"
|
||||||
|
android:layout_width="240dp"
|
||||||
|
android:layout_height="@dimen/medium_button_height"
|
||||||
|
android:layout_marginTop="@dimen/small_spacing"
|
||||||
|
android:layout_marginBottom="@dimen/medium_spacing"
|
||||||
|
android:text="@string/sheet_pn_mode_skip_button_title" />
|
||||||
|
|
||||||
|
</LinearLayout>
|
@ -0,0 +1,80 @@
|
|||||||
|
package org.thoughtcrime.securesms.loki.redesign.dialogs
|
||||||
|
|
||||||
|
import android.graphics.drawable.TransitionDrawable
|
||||||
|
import android.os.Bundle
|
||||||
|
import android.support.annotation.DrawableRes
|
||||||
|
import android.support.design.widget.BottomSheetDialogFragment
|
||||||
|
import android.view.LayoutInflater
|
||||||
|
import android.view.View
|
||||||
|
import android.view.ViewGroup
|
||||||
|
import android.widget.LinearLayout
|
||||||
|
import kotlinx.android.synthetic.main.fragment_pn_mode_bottom_sheet.*
|
||||||
|
import network.loki.messenger.R
|
||||||
|
|
||||||
|
class PNModeBottomSheet : BottomSheetDialogFragment() {
|
||||||
|
private var selectedOptionView: LinearLayout? = null
|
||||||
|
var onConfirmTapped: ((Boolean) -> Unit)? = null
|
||||||
|
var onSkipTapped: (() -> Unit)? = null
|
||||||
|
|
||||||
|
override fun onCreate(savedInstanceState: Bundle?) {
|
||||||
|
super.onCreate(savedInstanceState)
|
||||||
|
setStyle(STYLE_NORMAL, R.style.SessionBottomSheetDialogTheme)
|
||||||
|
}
|
||||||
|
|
||||||
|
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
|
||||||
|
return inflater.inflate(R.layout.fragment_pn_mode_bottom_sheet, container, false)
|
||||||
|
}
|
||||||
|
|
||||||
|
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
|
||||||
|
super.onViewCreated(view, savedInstanceState)
|
||||||
|
fcmOptionView.setOnClickListener { toggleFCM() }
|
||||||
|
backgroundPollingOptionView.setOnClickListener { toggleBackgroundPolling() }
|
||||||
|
confirmButton.setOnClickListener { onConfirmTapped?.invoke(selectedOptionView == fcmOptionView) }
|
||||||
|
skipButton.setOnClickListener { onSkipTapped?.invoke() }
|
||||||
|
}
|
||||||
|
|
||||||
|
// region Animation
|
||||||
|
private fun performTransition(@DrawableRes transitionID: Int, subject: View) {
|
||||||
|
val drawable = resources.getDrawable(transitionID, context!!.theme) as TransitionDrawable
|
||||||
|
subject.background = drawable
|
||||||
|
drawable.startTransition(250)
|
||||||
|
}
|
||||||
|
// endregion
|
||||||
|
|
||||||
|
// region Interaction
|
||||||
|
private fun toggleFCM() {
|
||||||
|
when (selectedOptionView) {
|
||||||
|
null -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_select_transition, fcmOptionView)
|
||||||
|
selectedOptionView = fcmOptionView
|
||||||
|
}
|
||||||
|
fcmOptionView -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_deselect_transition, fcmOptionView)
|
||||||
|
selectedOptionView = null
|
||||||
|
}
|
||||||
|
backgroundPollingOptionView -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_select_transition, fcmOptionView)
|
||||||
|
performTransition(R.drawable.pn_option_background_deselect_transition, backgroundPollingOptionView)
|
||||||
|
selectedOptionView = fcmOptionView
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private fun toggleBackgroundPolling() {
|
||||||
|
when (selectedOptionView) {
|
||||||
|
null -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_select_transition, backgroundPollingOptionView)
|
||||||
|
selectedOptionView = backgroundPollingOptionView
|
||||||
|
}
|
||||||
|
backgroundPollingOptionView -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_deselect_transition, backgroundPollingOptionView)
|
||||||
|
selectedOptionView = null
|
||||||
|
}
|
||||||
|
fcmOptionView -> {
|
||||||
|
performTransition(R.drawable.pn_option_background_select_transition, backgroundPollingOptionView)
|
||||||
|
performTransition(R.drawable.pn_option_background_deselect_transition, fcmOptionView)
|
||||||
|
selectedOptionView = backgroundPollingOptionView
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue