Switched to constraint layout + added currently selected tab animation

This commit is contained in:
Sylvain Berfini 2020-10-18 16:47:14 +02:00
parent 85ca0e73bd
commit 777206e07f
9 changed files with 292 additions and 137 deletions

View file

@ -170,12 +170,13 @@ dependencies {
implementation 'androidx.media:media:1.2.0'
implementation 'androidx.fragment:fragment-ktx:1.2.5'
implementation 'androidx.core:core-ktx:1.3.2'
implementation 'androidx.navigation:navigation-fragment-ktx:2.3.0'
implementation 'androidx.navigation:navigation-ui-ktx:2.3.0'
implementation 'androidx.navigation:navigation-fragment-ktx:2.3.1'
implementation 'androidx.navigation:navigation-ui-ktx:2.3.1'
implementation 'androidx.constraintlayout:constraintlayout:2.0.2'
implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
implementation 'androidx.lifecycle:lifecycle-viewmodel-ktx:2.2.0'
implementation 'androidx.recyclerview:recyclerview:1.1.0'
implementation 'androidx.constraintlayout:constraintlayout:2.0.2'
implementation 'com.google.android.material:material:1.2.1'
implementation 'com.google.android:flexbox:2.0.0'

View file

@ -23,7 +23,6 @@ import android.os.Bundle
import androidx.lifecycle.ViewModelProvider
import androidx.navigation.NavController
import androidx.navigation.NavDestination
import androidx.navigation.findNavController
import androidx.navigation.fragment.findNavController
import org.linphone.R
import org.linphone.activities.GenericFragment
@ -93,6 +92,11 @@ class TabsFragment : GenericFragment<TabsFragmentBinding>(), NavController.OnDes
destination: NavDestination,
arguments: Bundle?
) {
viewModel.updateTabSelection(destination.id)
when (destination.id) {
R.id.masterCallLogsFragment -> binding.selectorMotion.transitionToState(R.id.call_history)
R.id.masterContactsFragment -> binding.selectorMotion.transitionToState(R.id.contacts)
R.id.dialerFragment -> binding.selectorMotion.transitionToState(R.id.dialer)
R.id.masterChatRoomsFragment -> binding.selectorMotion.transitionToState(R.id.chat_rooms)
}
}
}

View file

@ -22,21 +22,9 @@ package org.linphone.activities.main.viewmodels
import androidx.lifecycle.MutableLiveData
import androidx.lifecycle.ViewModel
import org.linphone.LinphoneApplication.Companion.coreContext
import org.linphone.LinphoneApplication.Companion.corePreferences
import org.linphone.R
import org.linphone.core.*
class TabsViewModel : ViewModel() {
val showHistory: Boolean = corePreferences.showHistory
val showContacts: Boolean = corePreferences.showContacts
val showDialer: Boolean = corePreferences.showDialer
val showChat: Boolean = corePreferences.showChat
val historySelected = MutableLiveData<Boolean>()
val contactsSelected = MutableLiveData<Boolean>()
val dialerSelected = MutableLiveData<Boolean>()
val chatSelected = MutableLiveData<Boolean>()
val unreadMessagesCount = MutableLiveData<Int>()
val missedCallsCount = MutableLiveData<Int>()
@ -86,18 +74,4 @@ class TabsViewModel : ViewModel() {
fun updateUnreadChatCount() {
unreadMessagesCount.value = coreContext.core.unreadChatMessageCountFromActiveLocals
}
fun updateTabSelection(destinationId: Int) {
historySelected.value = false
contactsSelected.value = false
dialerSelected.value = false
chatSelected.value = false
when (destinationId) {
R.id.masterCallLogsFragment -> historySelected.value = true
R.id.masterContactsFragment -> contactsSelected.value = true
R.id.dialerFragment -> dialerSelected.value = true
R.id.masterChatRoomsFragment -> chatSelected.value = true
}
}
}

View file

@ -299,20 +299,6 @@ class CorePreferences constructor(private val context: Context) {
val dtmfKeypadVibration: Boolean
get() = config.getBool("app", "dtmf_keypad_vibraton", false)
/* Tabs */
val showHistory: Boolean
get() = config.getBool("app", "tabs_history", true)
val showContacts: Boolean
get() = config.getBool("app", "tabs_contacts", true)
val showDialer: Boolean
get() = config.getBool("app", "tabs_dialer", true)
val showChat: Boolean
get() = config.getBool("app", "tabs_chat", true)
/* Assistant */
val showCreateAccount: Boolean

View file

@ -1,5 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<layout xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android">
<data>
<import type="android.view.View"/>
@ -20,36 +21,51 @@
type="org.linphone.activities.main.viewmodels.TabsViewModel" />
</data>
<LinearLayout
android:baselineAligned="false"
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/footer"
android:layout_width="60dp"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="vertical">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.25" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineMiddle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineBottom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.75" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="@{historyClickListener}"
android:visibility="@{viewModel.showHistory ? View.VISIBLE : View.GONE}"
android:background="@drawable/footer_button">
android:background="@drawable/footer_button"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@id/guidelineTop"
android:onClick="@{historyClickListener}">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="15dp"
android:contentDescription="@string/content_description_menu_history"
android:padding="15dp"
android:src="@drawable/footer_history" />
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.historySelected ? View.VISIBLE : View.GONE, default=gone}" />
<TextView
style="@style/unread_count_font"
android:layout_width="wrap_content"
@ -67,76 +83,55 @@
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="@{contactsClickListener}"
android:visibility="@{viewModel.showContacts ? View.VISIBLE : View.GONE}"
android:background="@drawable/footer_button">
android:background="@drawable/footer_button"
app:layout_constraintTop_toTopOf="@id/guidelineTop"
app:layout_constraintBottom_toTopOf="@id/guidelineMiddle"
android:onClick="@{contactsClickListener}">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="15dp"
android:contentDescription="@string/content_description_menu_contacts"
android:padding="15dp"
android:src="@drawable/footer_contacts" />
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.contactsSelected ? View.VISIBLE : View.GONE, default=gone}" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="@{dialerClickListener}"
android:visibility="@{viewModel.showDialer ? View.VISIBLE : View.GONE}"
android:background="@drawable/footer_button">
android:background="@drawable/footer_button"
app:layout_constraintTop_toTopOf="@id/guidelineMiddle"
app:layout_constraintBottom_toTopOf="@id/guidelineBottom"
android:onClick="@{dialerClickListener}">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="15dp"
android:contentDescription="@string/content_description_menu_dialer"
android:padding="15dp"
android:src="@drawable/footer_dialer" />
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.dialerSelected ? View.VISIBLE : View.GONE, default=visible}" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:onClick="@{chatClickListener}"
android:visibility="@{viewModel.showChat ? View.VISIBLE : View.GONE}"
android:background="@drawable/footer_button">
android:background="@drawable/footer_button"
app:layout_constraintTop_toTopOf="@id/guidelineBottom"
app:layout_constraintBottom_toBottomOf="parent"
android:onClick="@{chatClickListener}">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:padding="15dp"
android:contentDescription="@string/content_description_menu_chat"
android:padding="15dp"
android:src="@drawable/footer_chat" />
<View
android:layout_width="5dp"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.chatSelected ? View.VISIBLE : View.GONE, default=gone}" />
<TextView
style="@style/unread_count_font"
android:layout_width="wrap_content"
@ -151,6 +146,35 @@
</RelativeLayout>
</LinearLayout>
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="@+id/selectorMotion"
android:layout_width="5dp"
android:layout_height="match_parent"
app:layoutDescription="@xml/tabs_land"
app:layout_constraintRight_toRightOf="parent">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/gTop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.25" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/gMiddle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<View
android:id="@+id/selector"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/accentColor" />
</androidx.constraintlayout.motion.widget.MotionLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>

View file

@ -48,6 +48,7 @@
android:layout_height="match_parent"
android:layout_above="@id/tabs_fragment"
app:defaultNavHost="true"
tools:layout="@layout/dialer_fragment"
app:navGraph="@navigation/main_nav_graph" />
<androidx.fragment.app.FragmentContainerView

View file

@ -20,19 +20,39 @@
type="org.linphone.activities.main.viewmodels.TabsViewModel" />
</data>
<LinearLayout
android:baselineAligned="false"
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/footer"
android:layout_width="match_parent"
android:layout_height="60dp"
android:orientation="horizontal">
android:layout_height="60dp">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.25" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineMiddle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guidelineRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.75" />
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="@{historyClickListener}"
android:visibility="@{viewModel.showHistory ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="@id/guidelineLeft"
android:background="@drawable/footer_button">
<ImageView
@ -43,13 +63,6 @@
android:contentDescription="@string/content_description_menu_history"
android:src="@drawable/footer_history" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.historySelected ? View.VISIBLE : View.GONE, default=gone}" />
<TextView
style="@style/unread_count_font"
android:layout_width="wrap_content"
@ -65,9 +78,9 @@
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="@{contactsClickListener}"
android:visibility="@{viewModel.showContacts ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="@id/guidelineLeft"
app:layout_constraintEnd_toEndOf="@id/guidelineMiddle"
android:background="@drawable/footer_button">
<ImageView
@ -78,21 +91,14 @@
android:contentDescription="@string/content_description_menu_contacts"
android:src="@drawable/footer_contacts" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.contactsSelected ? View.VISIBLE : View.GONE, default=gone}" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="@{dialerClickListener}"
android:visibility="@{viewModel.showDialer ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="@id/guidelineMiddle"
app:layout_constraintEnd_toEndOf="@id/guidelineRight"
android:background="@drawable/footer_button">
<ImageView
@ -103,21 +109,14 @@
android:contentDescription="@string/content_description_menu_dialer"
android:src="@drawable/footer_dialer" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.dialerSelected ? View.VISIBLE : View.GONE, default=visible}" />
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:onClick="@{chatClickListener}"
android:visibility="@{viewModel.showChat ? View.VISIBLE : View.GONE}"
app:layout_constraintStart_toStartOf="@id/guidelineRight"
app:layout_constraintEnd_toEndOf="parent"
android:background="@drawable/footer_button">
<ImageView
@ -128,13 +127,6 @@
android:contentDescription="@string/content_description_menu_chat"
android:src="@drawable/footer_chat" />
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:layout_alignParentBottom="true"
android:background="?attr/accentColor"
android:visibility="@{viewModel.chatSelected ? View.VISIBLE : View.GONE, default=gone}" />
<TextView
style="@style/unread_count_font"
android:layout_width="wrap_content"
@ -147,6 +139,35 @@
</RelativeLayout>
</LinearLayout>
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="@+id/selectorMotion"
android:layout_width="match_parent"
android:layout_height="5dp"
app:layoutDescription="@xml/tabs"
app:layout_constraintBottom_toBottomOf="parent">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/gLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.25" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/gMiddle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5" />
<View
android:id="@+id/selector"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/accentColor" />
</androidx.constraintlayout.motion.widget.MotionLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>

View file

@ -0,0 +1,72 @@
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
motion:constraintSetStart="@+id/dialer"
motion:constraintSetEnd="@+id/chat_rooms"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/contacts"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/dialer"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/chat_rooms"/>
<Transition
motion:constraintSetStart="@+id/contacts"
motion:constraintSetEnd="@+id/dialer"/>
<Transition
motion:constraintSetStart="@+id/contacts"
motion:constraintSetEnd="@+id/chat_rooms"/>
<ConstraintSet android:id="@+id/call_history">
<Constraint
android:id="@id/selector"
android:layout_height="wrap_content"
motion:layout_constraintWidth_percent=".25"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintLeft_toLeftOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="@+id/contacts">
<Constraint
android:id="@id/selector"
android:layout_height="wrap_content"
motion:layout_constraintWidth_percent=".25"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintLeft_toLeftOf="@id/gLeft" />
</ConstraintSet>
<ConstraintSet android:id="@+id/dialer">
<Constraint
android:id="@id/selector"
android:layout_height="wrap_content"
motion:layout_constraintWidth_percent=".25"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintLeft_toLeftOf="@id/gMiddle" />
</ConstraintSet>
<ConstraintSet android:id="@+id/chat_rooms">
<Constraint
android:id="@id/selector"
android:layout_height="wrap_content"
motion:layout_constraintWidth_percent=".25"
motion:layout_constraintBottom_toBottomOf="parent"
motion:layout_constraintRight_toRightOf="parent" />
</ConstraintSet>
</MotionScene>

View file

@ -0,0 +1,72 @@
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
motion:constraintSetStart="@+id/dialer"
motion:constraintSetEnd="@+id/chat_rooms"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/contacts"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/dialer"/>
<Transition
motion:constraintSetStart="@+id/call_history"
motion:constraintSetEnd="@+id/chat_rooms"/>
<Transition
motion:constraintSetStart="@+id/contacts"
motion:constraintSetEnd="@+id/dialer"/>
<Transition
motion:constraintSetStart="@+id/contacts"
motion:constraintSetEnd="@+id/chat_rooms"/>
<ConstraintSet android:id="@+id/call_history">
<Constraint
android:id="@id/selector"
android:layout_width="wrap_content"
motion:layout_constraintHeight_percent=".25"
motion:layout_constraintRight_toRightOf="parent"
motion:layout_constraintTop_toTopOf="parent" />
</ConstraintSet>
<ConstraintSet android:id="@+id/contacts">
<Constraint
android:id="@id/selector"
android:layout_width="wrap_content"
motion:layout_constraintHeight_percent=".25"
motion:layout_constraintRight_toRightOf="parent"
motion:layout_constraintTop_toTopOf="@id/gTop" />
</ConstraintSet>
<ConstraintSet android:id="@+id/dialer">
<Constraint
android:id="@id/selector"
android:layout_width="wrap_content"
motion:layout_constraintHeight_percent=".25"
motion:layout_constraintRight_toRightOf="parent"
motion:layout_constraintTop_toTopOf="@id/gMiddle" />
</ConstraintSet>
<ConstraintSet android:id="@+id/chat_rooms">
<Constraint
android:id="@id/selector"
android:layout_width="wrap_content"
motion:layout_constraintHeight_percent=".25"
motion:layout_constraintRight_toRightOf="parent"
motion:layout_constraintBottom_toBottomOf="parent" />
</ConstraintSet>
</MotionScene>