Skip to content

Commit eb44d5b

Browse files
SmartToolFactorySmartToolFactory
committed
Merge branch 'feature/before-after-layout' into develop
2 parents 6f7c2d6 + 9ca0753 commit eb44d5b

23 files changed

+1908
-513
lines changed

‎app/build.gradle‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,9 @@ dependencies {
7979
// Coil
8080
implementation("io.coil-kt:coil-compose:2.1.0")
8181

82+
// ExoPlayer
83+
implementation 'com.google.android.exoplayer:exoplayer:2.18.0'
84+
8285
def accompanist_version = "0.24.12-rc"
8386
// Accompanist
8487
implementation "com.google.accompanist:accompanist-systemuicontroller:$accompanist_version"

‎app/src/main/AndroidManifest.xml‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
33
xmlns:tools="http://schemas.android.com/tools">
44

5+
<uses-permission android:name="android.permission.INTERNET" />
6+
57
<application
68
android:allowBackup="true"
79
android:dataExtractionRules="@xml/data_extraction_rules"
@@ -15,7 +17,6 @@
1517
<activity
1618
android:name=".MainActivity"
1719
android:exported="true"
18-
android:label="@string/app_name"
1920
android:theme="@style/Theme.ComposeImage">
2021
<intent-filter>
2122
<action android:name="android.intent.action.MAIN" />

‎app/src/main/assets/floodplain_clean.mp4‎

1010 KB
Binary file not shown.

‎app/src/main/assets/floodplain_dirty.mp4‎

891 KB
Binary file not shown.

‎app/src/main/java/com/smarttoolfactory/composeimage/MainActivity.kt‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,8 @@ private fun HomeContent() {
9292
2 -> EditScaleDemo()
9393
3 -> EditSizeDemo()
9494
4 -> ZoomDemo()
95-
else -> BeforeAfterImageDemo()
95+
5 -> BeforeAfterImageDemo()
96+
else -> BeforeAfterLayoutDemo()
9697
}
9798
}
9899
}
@@ -105,5 +106,6 @@ internal val tabList =
105106
"Editable Scale",
106107
"Editable Size",
107108
"Zoom",
108-
"Before/After",
109+
"Before/After Image",
110+
"Before/After Layout",
109111
)

‎app/src/main/java/com/smarttoolfactory/composeimage/demo/BeforeAfterImageDemo.kt‎

Lines changed: 47 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,14 @@
11
package com.smarttoolfactory.composeimage.demo
22

33
import androidx.compose.animation.core.*
4-
import androidx.compose.foundation.background
54
import androidx.compose.foundation.border
65
import androidx.compose.foundation.layout.*
76
import androidx.compose.foundation.rememberScrollState
87
import androidx.compose.foundation.shape.RoundedCornerShape
98
import androidx.compose.foundation.verticalScroll
109
import androidx.compose.material3.MaterialTheme
1110
import androidx.compose.material3.Text
12-
import androidx.compose.runtime.Composable
13-
import androidx.compose.runtime.getValue
14-
import androidx.compose.ui.Alignment
11+
import androidx.compose.runtime.*
1512
import androidx.compose.ui.Modifier
1613
import androidx.compose.ui.draw.clip
1714
import androidx.compose.ui.draw.shadow
@@ -23,9 +20,10 @@ import androidx.compose.ui.res.imageResource
2320
import androidx.compose.ui.text.font.FontWeight
2421
import androidx.compose.ui.unit.dp
2522
import androidx.compose.ui.unit.sp
23+
import com.smarttoolfactory.composeimage.ContentScaleSelectionMenu
2624
import com.smarttoolfactory.composeimage.R
2725
import com.smarttoolfactory.image.beforeafter.BeforeAfterImage
28-
import com.smarttoolfactory.image.beforeafter.Order
26+
import com.smarttoolfactory.image.beforeafter.ContentOrder
2927
import kotlin.math.roundToInt
3028

3129
@Composable
@@ -45,19 +43,19 @@ fun BeforeAfterImageDemo() {
4543
)
4644

4745
val imageBefore2 = ImageBitmap.imageResource(
48-
LocalContext.current.resources, R.drawable.image_before_after_elements_a
46+
LocalContext.current.resources, R.drawable.landscape5_before
4947
)
5048

5149
val imageAfter2 = ImageBitmap.imageResource(
52-
LocalContext.current.resources, R.drawable.image_before_after_elements_b
50+
LocalContext.current.resources, R.drawable.landscape5
5351
)
5452

5553
val imageBefore3 = ImageBitmap.imageResource(
56-
LocalContext.current.resources, R.drawable.landscape5_before
54+
LocalContext.current.resources, R.drawable.image_before_after_elements_a
5755
)
5856

5957
val imageAfter3 = ImageBitmap.imageResource(
60-
LocalContext.current.resources, R.drawable.landscape5
58+
LocalContext.current.resources, R.drawable.image_before_after_elements_b
6159
)
6260

6361
Text(
@@ -68,6 +66,12 @@ fun BeforeAfterImageDemo() {
6866
modifier = Modifier.padding(8.dp)
6967
)
7068

69+
var contentScale by remember { mutableStateOf(ContentScale.FillBounds) }
70+
ContentScaleSelectionMenu(contentScale = contentScale) {
71+
contentScale = it
72+
}
73+
74+
7175
Text(
7276
text = "Order",
7377
fontSize = 16.sp,
@@ -76,54 +80,28 @@ fun BeforeAfterImageDemo() {
7680
modifier = Modifier.padding(8.dp)
7781
)
7882

79-
Box {
80-
BeforeAfterImage(
81-
modifier = Modifier
82-
.shadow(1.dp, RoundedCornerShape(10.dp))
83-
.fillMaxWidth()
84-
.aspectRatio(4 / 3f),
85-
beforeImage = imageBefore,
86-
afterImage = imageAfter,
87-
contentScale = ContentScale.FillBounds
88-
)
89-
Label(
90-
text = "BEFORE",
91-
modifier = Modifier
92-
.padding(8.dp)
93-
.align(Alignment.TopStart)
94-
)
95-
Label(
96-
text = "AFTER", modifier = Modifier
97-
.padding(8.dp)
98-
.align(Alignment.TopEnd)
99-
)
100-
}
83+
BeforeAfterImage(
84+
modifier = Modifier
85+
.shadow(1.dp, RoundedCornerShape(10.dp))
86+
.fillMaxWidth()
87+
.aspectRatio(4 / 3f),
88+
beforeImage = imageBefore,
89+
afterImage = imageAfter,
90+
contentScale = contentScale
91+
)
10192

10293
Spacer(modifier = Modifier.height(40.dp))
10394

104-
Box {
105-
BeforeAfterImage(
106-
modifier = Modifier
107-
.shadow(1.dp, RoundedCornerShape(10.dp))
108-
.fillMaxWidth()
109-
.aspectRatio(4 / 3f),
110-
beforeImage = imageBefore,
111-
afterImage = imageAfter,
112-
order = Order.AfterBefore,
113-
contentScale = ContentScale.FillBounds
114-
)
115-
Label(
116-
text = "AFTER",
117-
modifier = Modifier
118-
.padding(8.dp)
119-
.align(Alignment.TopStart)
120-
)
121-
Label(
122-
text = "BEFORE", modifier = Modifier
123-
.padding(8.dp)
124-
.align(Alignment.TopEnd)
125-
)
126-
}
95+
BeforeAfterImage(
96+
modifier = Modifier
97+
.shadow(1.dp, RoundedCornerShape(10.dp))
98+
.fillMaxWidth()
99+
.aspectRatio(4 / 3f),
100+
beforeImage = imageBefore,
101+
afterImage = imageAfter,
102+
contentOrder = ContentOrder.AfterBefore,
103+
contentScale = contentScale
104+
)
127105

128106
Spacer(modifier = Modifier.height(40.dp))
129107
Text(
@@ -134,29 +112,16 @@ fun BeforeAfterImageDemo() {
134112
modifier = Modifier.padding(8.dp)
135113
)
136114

137-
Box {
138-
BeforeAfterImage(
139-
modifier = Modifier
140-
.shadow(1.dp, RoundedCornerShape(10.dp))
141-
.fillMaxWidth()
142-
.aspectRatio(4 / 3f),
143-
beforeImage = imageBefore3,
144-
afterImage = imageAfter3,
145-
order = Order.AfterBefore,
146-
contentScale = ContentScale.FillBounds
147-
)
148-
Label(
149-
text = "AFTER",
150-
modifier = Modifier
151-
.padding(8.dp)
152-
.align(Alignment.TopStart)
153-
)
154-
Label(
155-
text = "BEFORE", modifier = Modifier
156-
.padding(8.dp)
157-
.align(Alignment.TopEnd)
158-
)
159-
}
115+
BeforeAfterImage(
116+
modifier = Modifier
117+
.shadow(1.dp, RoundedCornerShape(10.dp))
118+
.fillMaxWidth()
119+
.aspectRatio(4 / 3f),
120+
beforeImage = imageBefore2,
121+
afterImage = imageAfter2,
122+
contentOrder = ContentOrder.AfterBefore,
123+
contentScale = contentScale
124+
)
160125

161126

162127
Spacer(modifier = Modifier.height(40.dp))
@@ -189,11 +154,13 @@ fun BeforeAfterImageDemo() {
189154
.border(3.dp, Color(0xffE91E63), RoundedCornerShape(10.dp))
190155
.fillMaxWidth()
191156
.aspectRatio(4 / 3f),
192-
beforeImage = imageBefore2,
193-
afterImage = imageAfter2,
157+
beforeImage = imageBefore3,
158+
afterImage = imageAfter3,
194159
progress = progress,
195160
onProgressChange = {},
196-
contentScale = ContentScale.FillBounds
161+
contentScale = contentScale,
162+
beforeLabel = {},
163+
afterLabel = {},
197164
) {
198165
Text(
199166
"${(progress).roundToInt()}%",
@@ -204,16 +171,3 @@ fun BeforeAfterImageDemo() {
204171
}
205172
}
206173
}
207-
208-
@Composable
209-
private fun Label(modifier: Modifier = Modifier, text: String) {
210-
Text(
211-
text = text,
212-
color = Color.White,
213-
fontSize = 14.sp,
214-
fontWeight = FontWeight.Bold,
215-
modifier = modifier
216-
.background(Color.Black.copy(alpha = .4f), RoundedCornerShape(50))
217-
.padding(8.dp)
218-
)
219-
}

0 commit comments

Comments
 (0)