Skip to content

Commit 7f4a451

Browse files
authored
MotionLayout Animation (#71)
* Adding animations screen, fixing problem with WorkerParameters which causes crashes on launch. * Creating animation with MotionLayout.
1 parent 814c020 commit 7f4a451

File tree

12 files changed

+365
-7
lines changed

12 files changed

+365
-7
lines changed
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
package com.rocketinsights.android.ui
2+
3+
import android.os.Bundle
4+
import android.view.Menu
5+
import android.view.MenuInflater
6+
import androidx.fragment.app.Fragment
7+
import com.rocketinsights.android.R
8+
9+
/**
10+
* Animations fragment contains cards which can be used to launch different animations.
11+
* This screen also runs ConstraintSet animation on cards and subtitle by using MotionLayout.
12+
*/
13+
class AnimationsFragment : Fragment(R.layout.fragment_animations) {
14+
15+
override fun onCreate(savedInstanceState: Bundle?) {
16+
super.onCreate(savedInstanceState)
17+
setHasOptionsMenu(true)
18+
}
19+
20+
override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
21+
menu.setGroupVisible(R.id.menu_items_group, false)
22+
}
23+
}

app/src/main/java/com/rocketinsights/android/ui/MainFragment.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ class MainFragment : Fragment(R.layout.fragment_main) {
7676
true
7777
}
7878
R.id.maps_fragment -> item.onNavDestinationSelected(findNavController())
79+
R.id.animations_fragment -> item.onNavDestinationSelected(findNavController())
7980
R.id.menu_login -> {
8081
authManager.launchSignInFlow()
8182
true

app/src/main/java/com/rocketinsights/android/work/messages/MessagesUpdateWorker.kt

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ private const val WORK_FAILED_HTTP = "Messages update work failed with HTTP exce
1212
private const val WORK_FAILED = "Messages update work failed with unknown exception."
1313

1414
class MessagesUpdateWorker(
15-
private val messageRepository: MessageRepository,
1615
context: Context,
17-
params: WorkerParameters
16+
params: WorkerParameters,
17+
private val messageRepository: MessageRepository
1818
) : CoroutineWorker(context, params) {
1919

2020
override suspend fun doWork(): Result {
Lines changed: 184 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,184 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<androidx.constraintlayout.motion.widget.MotionLayout
3+
xmlns:android="http://schemas.android.com/apk/res/android"
4+
xmlns:app="http://schemas.android.com/apk/res-auto"
5+
xmlns:tools="http://schemas.android.com/tools"
6+
android:layout_width="match_parent"
7+
android:layout_height="match_parent"
8+
android:background="@color/blue_100"
9+
app:layoutDescription="@xml/fragment_animations_scene"
10+
tools:context=".ui.AnimationsFragment">
11+
12+
<TextView
13+
android:id="@+id/text_title"
14+
android:layout_width="wrap_content"
15+
android:layout_height="wrap_content"
16+
android:layout_marginTop="@dimen/activity_vertical_margin"
17+
android:layout_marginStart="@dimen/activity_horizontal_margin"
18+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
19+
android:text="@string/animations"
20+
android:textAppearance="?attr/textAppearanceHeadline3"
21+
android:textColor="@color/black"
22+
app:layout_constraintEnd_toEndOf="parent"
23+
app:layout_constraintStart_toStartOf="parent"
24+
app:layout_constraintTop_toTopOf="parent" />
25+
26+
<TextView
27+
android:id="@+id/text_subtitle"
28+
android:layout_width="wrap_content"
29+
android:layout_height="wrap_content"
30+
android:text="@string/animation_screen_subtitle"
31+
android:textAppearance="?attr/textAppearanceSubtitle1"
32+
android:textColor="@color/black" />
33+
34+
<com.google.android.material.card.MaterialCardView
35+
android:id="@+id/card_animation_1"
36+
android:layout_width="match_parent"
37+
android:layout_height="wrap_content"
38+
style="@style/CardView.AndroidBase.Animation">
39+
40+
<androidx.constraintlayout.widget.ConstraintLayout
41+
android:layout_width="match_parent"
42+
android:layout_height="wrap_content"
43+
app:layout_constraintBottom_toBottomOf="parent"
44+
app:layout_constraintEnd_toEndOf="parent"
45+
app:layout_constraintStart_toStartOf="parent"
46+
app:layout_constraintTop_toTopOf="parent">
47+
48+
<TextView
49+
android:id="@+id/text_animation1_title"
50+
android:layout_width="0dp"
51+
android:layout_height="wrap_content"
52+
android:layout_marginStart="@dimen/activity_horizontal_margin"
53+
android:layout_marginTop="@dimen/activity_vertical_margin"
54+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
55+
android:text="@string/animation_1_title"
56+
android:textAppearance="?attr/textAppearanceBody1"
57+
android:textColor="@color/black"
58+
android:textStyle="bold"
59+
app:layout_constraintEnd_toEndOf="parent"
60+
app:layout_constraintStart_toStartOf="parent"
61+
app:layout_constraintTop_toTopOf="parent" />
62+
63+
<TextView
64+
android:id="@+id/text_animation1_desc"
65+
android:layout_width="0dp"
66+
android:layout_height="wrap_content"
67+
android:layout_marginTop="@dimen/margin_small"
68+
android:layout_marginStart="@dimen/activity_horizontal_margin"
69+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
70+
android:layout_marginBottom="@dimen/activity_vertical_margin"
71+
android:ellipsize="end"
72+
android:maxLines="2"
73+
android:text="@string/animation_1_description"
74+
android:textAppearance="?attr/textAppearanceSubtitle2"
75+
android:textColor="@color/black"
76+
app:layout_constraintBottom_toBottomOf="parent"
77+
app:layout_constraintEnd_toEndOf="parent"
78+
app:layout_constraintStart_toStartOf="parent"
79+
app:layout_constraintTop_toBottomOf="@+id/text_animation1_title" />
80+
</androidx.constraintlayout.widget.ConstraintLayout>
81+
82+
</com.google.android.material.card.MaterialCardView>
83+
84+
<com.google.android.material.card.MaterialCardView
85+
android:id="@+id/card_animation_2"
86+
android:layout_width="match_parent"
87+
android:layout_height="wrap_content"
88+
style="@style/CardView.AndroidBase.Animation">
89+
90+
<androidx.constraintlayout.widget.ConstraintLayout
91+
android:layout_width="match_parent"
92+
android:layout_height="wrap_content"
93+
app:layout_constraintBottom_toBottomOf="parent"
94+
app:layout_constraintEnd_toEndOf="parent"
95+
app:layout_constraintStart_toStartOf="parent"
96+
app:layout_constraintTop_toTopOf="parent">
97+
98+
<TextView
99+
android:id="@+id/text_animation2_title"
100+
android:layout_width="0dp"
101+
android:layout_height="wrap_content"
102+
android:layout_marginStart="@dimen/activity_horizontal_margin"
103+
android:layout_marginTop="@dimen/activity_vertical_margin"
104+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
105+
android:text="@string/animation_2_title"
106+
android:textAppearance="?attr/textAppearanceBody1"
107+
android:textColor="@color/black"
108+
android:textStyle="bold"
109+
app:layout_constraintEnd_toEndOf="parent"
110+
app:layout_constraintStart_toStartOf="parent"
111+
app:layout_constraintTop_toTopOf="parent" />
112+
113+
<TextView
114+
android:id="@+id/text_animation2_desc"
115+
android:layout_width="0dp"
116+
android:layout_height="wrap_content"
117+
android:layout_marginTop="@dimen/margin_small"
118+
android:layout_marginStart="@dimen/activity_horizontal_margin"
119+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
120+
android:layout_marginBottom="@dimen/activity_vertical_margin"
121+
android:ellipsize="end"
122+
android:maxLines="2"
123+
android:text="@string/animation_2_description"
124+
android:textAppearance="?attr/textAppearanceSubtitle2"
125+
android:textColor="@color/black"
126+
app:layout_constraintBottom_toBottomOf="parent"
127+
app:layout_constraintEnd_toEndOf="parent"
128+
app:layout_constraintStart_toStartOf="parent"
129+
app:layout_constraintTop_toBottomOf="@+id/text_animation2_title" />
130+
</androidx.constraintlayout.widget.ConstraintLayout>
131+
132+
</com.google.android.material.card.MaterialCardView>
133+
134+
<com.google.android.material.card.MaterialCardView
135+
android:id="@+id/card_animation_3"
136+
android:layout_width="match_parent"
137+
android:layout_height="wrap_content"
138+
style="@style/CardView.AndroidBase.Animation">
139+
140+
<androidx.constraintlayout.widget.ConstraintLayout
141+
android:layout_width="match_parent"
142+
android:layout_height="wrap_content"
143+
app:layout_constraintBottom_toBottomOf="parent"
144+
app:layout_constraintEnd_toEndOf="parent"
145+
app:layout_constraintStart_toStartOf="parent"
146+
app:layout_constraintTop_toTopOf="parent">
147+
148+
<TextView
149+
android:id="@+id/text_animation3_title"
150+
android:layout_width="0dp"
151+
android:layout_height="wrap_content"
152+
android:layout_marginStart="@dimen/activity_horizontal_margin"
153+
android:layout_marginTop="@dimen/activity_vertical_margin"
154+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
155+
android:text="@string/animation_3_title"
156+
android:textAppearance="?attr/textAppearanceBody1"
157+
android:textColor="@color/black"
158+
android:textStyle="bold"
159+
app:layout_constraintEnd_toEndOf="parent"
160+
app:layout_constraintStart_toStartOf="parent"
161+
app:layout_constraintTop_toTopOf="parent" />
162+
163+
<TextView
164+
android:id="@+id/text_animation3_desc"
165+
android:layout_width="0dp"
166+
android:layout_height="wrap_content"
167+
android:layout_marginTop="@dimen/margin_small"
168+
android:layout_marginStart="@dimen/activity_horizontal_margin"
169+
android:layout_marginEnd="@dimen/activity_horizontal_margin"
170+
android:layout_marginBottom="@dimen/activity_vertical_margin"
171+
android:ellipsize="end"
172+
android:maxLines="2"
173+
android:text="@string/animation_3_description"
174+
android:textAppearance="?attr/textAppearanceSubtitle2"
175+
android:textColor="@color/black"
176+
app:layout_constraintBottom_toBottomOf="parent"
177+
app:layout_constraintEnd_toEndOf="parent"
178+
app:layout_constraintStart_toStartOf="parent"
179+
app:layout_constraintTop_toBottomOf="@+id/text_animation3_title" />
180+
</androidx.constraintlayout.widget.ConstraintLayout>
181+
182+
</com.google.android.material.card.MaterialCardView>
183+
184+
</androidx.constraintlayout.motion.widget.MotionLayout>

app/src/main/res/layout/list_item_message.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
android:id="@+id/text_time"
2323
android:layout_width="0dp"
2424
android:layout_height="wrap_content"
25-
android:layout_marginTop="@dimen/margin_8"
25+
android:layout_marginTop="@dimen/margin_small"
2626
android:layout_marginBottom="@dimen/activity_vertical_margin"
2727
android:layout_marginEnd="@dimen/activity_horizontal_margin"
2828
android:textStyle="bold"

app/src/main/res/menu/main_menu.xml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,9 @@
1111
<item
1212
android:id="@+id/maps_fragment"
1313
android:title="@string/maps_display" />
14+
<item
15+
android:id="@+id/animations_fragment"
16+
android:title="@string/animations" />
1417
<item
1518
android:id="@+id/menu_login"
1619
android:title="@string/login" />

app/src/main/res/navigation/nav_graph.xml

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,13 @@
3939
app:exitAnim="@anim/nav_default_exit_anim"
4040
app:popEnterAnim="@anim/nav_default_pop_enter_anim"
4141
app:popExitAnim="@anim/nav_default_pop_exit_anim" />
42+
<action
43+
android:id="@+id/show_animations_fragment"
44+
app:destination="@id/animations_fragment"
45+
app:enterAnim="@anim/nav_default_enter_anim"
46+
app:exitAnim="@anim/nav_default_exit_anim"
47+
app:popEnterAnim="@anim/nav_default_pop_enter_anim"
48+
app:popExitAnim="@anim/nav_default_pop_exit_anim" />
4249
</fragment>
4350
<fragment
4451
android:id="@+id/secondFragment"
@@ -60,4 +67,9 @@
6067
android:name="com.rocketinsights.android.ui.MapsFragment"
6168
android:label="@string/maps"
6269
tools:layout="@layout/fragment_maps" />
70+
<fragment
71+
android:id="@+id/animations_fragment"
72+
android:name="com.rocketinsights.android.ui.AnimationsFragment"
73+
android:label="@string/animations"
74+
tools:layout="@layout/fragment_animations" />
6375
</navigation>

app/src/main/res/values/colors.xml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,6 @@
55
<color name="colorAccent">#FF4081</color>
66

77
<color name="white">#FFFFFF</color>
8+
<color name="black">#000000</color>
9+
<color name="blue_100">#bbdefb</color>
810
</resources>

app/src/main/res/values/dimens.xml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@
22
<!-- Default screen margins, per the Android Design guidelines. -->
33
<dimen name="activity_horizontal_margin">16dp</dimen>
44
<dimen name="activity_vertical_margin">16dp</dimen>
5-
<dimen name="margin_8">8dp</dimen>
5+
<dimen name="margin_small">8dp</dimen>
66
<dimen name="tall_toolbar_height">300dp</dimen>
77
<dimen name="progress_bar_size">40dp</dimen>
88
<dimen name="fragment_messages_min_height">700dp</dimen>
99
<dimen name="fragment_photo_min_height">700dp</dimen>
1010
<dimen name="main_message_margin_top">70dp</dimen>
1111
<dimen name="main_image_size">100dp</dimen>
12+
<dimen name="animation_subtitle_translation_start">10dp</dimen>
1213
</resources>

app/src/main/res/values/strings.xml

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,16 @@
3131
<string name="maps_display">Display Google Maps</string>
3232
<string name="maps_current_position">You are here!</string>
3333

34-
<!-- TODO: Remove or change this placeholder text -->
35-
<string name="hello_blank_fragment">Hello blank fragment</string>
34+
<!--Animations-->
35+
<string name="animations">Animations</string>
36+
<string name="animation_screen_subtitle">Quick access to animation examples on Android</string>
37+
<string name="animation_1_title">Animation 1 Title</string>
38+
<string name="animation_2_title">Animation 2 Title</string>
39+
<string name="animation_3_title">Animation 3 Title</string>
40+
<string name="animation_1_description">Animation 1 Description - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</string>
41+
<string name="animation_2_description">Animation 2 Description - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</string>
42+
<string name="animation_3_description">Animation 3 Description - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod</string>
43+
3644
<string name="parallax_image">Parallax image</string>
3745
<string name="login">Login</string>
3846
<string name="logout">Logout</string>

app/src/main/res/values/styles.xml

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<resources>
22

33
<!-- Base application theme. -->
4-
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
4+
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
55
<!-- Customize your theme here. -->
66
<item name="colorPrimary">@color/colorPrimary</item>
77
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
@@ -16,4 +16,10 @@
1616
<item name="android:textColor">@color/white</item>
1717
</style>
1818

19+
<style name="CardView.AndroidBase.Animation" parent="Widget.MaterialComponents.CardView">
20+
<item name="cardBackgroundColor">@color/white</item>
21+
<item name="cardCornerRadius">8dp</item>
22+
<item name="cardElevation">8dp</item>
23+
</style>
24+
1925
</resources>

0 commit comments

Comments
 (0)