Skip to content

Commit 5175b9c

Browse files
revamp demos with each separate sections
1 parent 4fa9930 commit 5175b9c

22 files changed

+929
-165
lines changed

app/build.gradle

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ plugins {
55

66
android {
77
namespace 'com.smarttoolfactory.composeimage'
8-
compileSdk 32
8+
compileSdk 33
99

1010
defaultConfig {
11-
applicationId "com.example.composeimage"
11+
applicationId "com.smarttoolfactory.composeimage"
1212
minSdk 21
13-
targetSdk 32
13+
targetSdk 33
1414
versionCode 1
1515
versionName "1.0"
1616

@@ -51,7 +51,7 @@ dependencies {
5151
implementation project(':image')
5252

5353
implementation 'androidx.core:core-ktx:1.8.0'
54-
implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.5.0'
54+
implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.5.1'
5555

5656
implementation 'com.github.SmartToolFactory:Compose-Extended-Gestures:2.0.0'
5757

@@ -66,12 +66,12 @@ dependencies {
6666
implementation "androidx.compose.material:material-icons-core:$compose_version"
6767
implementation "androidx.compose.material:material-icons-extended:$compose_version"
6868
// Integration with activities
69-
implementation 'androidx.activity:activity-compose:1.5.0'
69+
implementation 'androidx.activity:activity-compose:1.5.1'
7070
// Integration with ViewModels
71-
implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.5.0'
71+
implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.5.1'
7272

7373
// Material Design 3 for Compose
74-
implementation "androidx.compose.material3:material3:1.0.0-alpha14"
74+
implementation "androidx.compose.material3:material3:1.0.0-alpha16"
7575

7676
// Photo Picker
7777
implementation("com.google.modernstorage:modernstorage-photopicker:1.0.0-alpha06")
@@ -80,9 +80,13 @@ dependencies {
8080
implementation("io.coil-kt:coil-compose:2.1.0")
8181

8282
// ExoPlayer
83-
implementation 'com.google.android.exoplayer:exoplayer:2.18.0'
83+
implementation 'com.google.android.exoplayer:exoplayer:2.18.1'
8484

85-
def accompanist_version = "0.24.12-rc"
85+
86+
def nav_compose_version = "2.5.1"
87+
implementation "androidx.navigation:navigation-compose:$nav_compose_version"
88+
89+
def accompanist_version = "0.25.0"
8690
// Accompanist
8791
implementation "com.google.accompanist:accompanist-systemuicontroller:$accompanist_version"
8892
implementation "com.google.accompanist:accompanist-pager:$accompanist_version"

app/src/main/java/com/smarttoolfactory/composeimage/ContentScaleSelectionMenu.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import androidx.compose.ui.unit.sp
1717
val contentScaleOptions =
1818
listOf("None", "Fit", "Crop", "FillBounds", "FillWidth", "FillHeight", "Inside")
1919

20+
@OptIn(ExperimentalMaterial3Api::class)
2021
@Composable
2122
fun ContentScaleSelectionMenu(
2223
contentScale: ContentScale,
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
package com.smarttoolfactory.composeimage
2+
3+
import androidx.compose.runtime.Composable
4+
import androidx.compose.ui.Modifier
5+
import androidx.navigation.NavHostController
6+
import androidx.navigation.compose.NavHost
7+
import androidx.navigation.compose.composable
8+
import androidx.navigation.compose.rememberNavController
9+
import com.smarttoolfactory.composeimage.screen.*
10+
11+
12+
@Composable
13+
fun DemoNavGraph(
14+
modifier: Modifier = Modifier,
15+
navController: NavHostController = rememberNavController(),
16+
startDestination: String = Destinations.Home,
17+
) {
18+
19+
NavHost(
20+
modifier = modifier,
21+
navController = navController,
22+
startDestination = startDestination
23+
) {
24+
25+
composable(route = Destinations.Home) { navBackEntryStack ->
26+
DemoSelectionScreen { route: String ->
27+
navController.navigate(route)
28+
}
29+
}
30+
31+
composable(route = Destinations.Image) { navBackEntryStack ->
32+
ImageDemoScreen()
33+
}
34+
composable(route = Destinations.Zoom) { navBackEntryStack ->
35+
ZoomDemoScreen()
36+
}
37+
composable(route = Destinations.Transform) { navBackEntryStack ->
38+
TransformDemoScreen()
39+
}
40+
composable(route = Destinations.BeforeAfter) { navBackEntryStack ->
41+
BeforeAfterDemoScreen()
42+
}
43+
}
44+
}
45+
46+
object Destinations {
47+
const val Home = "selection_screen"
48+
const val Image = "image_screen"
49+
const val Zoom = "zoom_screen"
50+
const val Transform = "transform_screen"
51+
const val BeforeAfter = "before_after_screen"
52+
}

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

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -42,13 +42,16 @@ class MainActivity : ComponentActivity() {
4242
modifier = Modifier.fillMaxSize(),
4343
color = MaterialTheme.colorScheme.background
4444
) {
45-
HomeContent()
45+
// Uncomment to display demos on pager in one screen
46+
// HomeContent()
47+
DemoNavGraph()
4648
}
4749
}
4850
}
4951
}
5052
}
5153

54+
@OptIn(ExperimentalMaterial3Api::class)
5255
@ExperimentalPagerApi
5356
@Composable
5457
private fun HomeContent() {
@@ -99,29 +102,30 @@ private fun HomeContent() {
99102
when (page) {
100103
0 -> ImageWithConstraintsDemo()
101104
1 -> ThumbnailDemo()
102-
2 -> EditScaleDemo()
103-
3 -> EditSizeDemo()
104-
4 -> BeforeAfterImageDemo()
105-
5 -> BeforeAfterLayoutDemo()
106-
6 -> ZoomDemo()
107-
7 -> EnhancedZoomDemo()
108-
8 -> EnhancedZoomCropDemo()
109-
else -> AnimatedZoomDemo()
105+
2 -> ZoomDemo()
106+
3 -> EnhancedZoomDemo()
107+
4 -> EnhancedZoomCropDemo()
108+
5 -> AnimatedZoomDemo()
109+
6 -> BeforeAfterImageDemo()
110+
7 -> BeforeAfterLayoutDemo()
111+
8 -> EditScaleDemo()
112+
else -> EditSizeDemo()
110113
}
111114
}
112115
}
113116
}
114117

118+
115119
internal val tabList =
116120
listOf(
117121
"Image Constraints",
118122
"Image Thumbnail",
119-
"Editable Scale",
120-
"Editable Size",
121-
"Before/After Image",
122-
"Before/After Layout",
123123
"Zoom",
124124
"Enhanced Zoom",
125125
"Enhanced Zoom Crop",
126-
"Animated Zoom"
126+
"Animated Zoom",
127+
"Before/After Image",
128+
"Before/After Layout",
129+
"Editable Scale",
130+
"Editable Size",
127131
)
Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
package com.smarttoolfactory.composeimage
2+
3+
import androidx.compose.foundation.layout.fillMaxWidth
4+
import androidx.compose.foundation.layout.padding
5+
import androidx.compose.material3.*
6+
import androidx.compose.material3.TabRowDefaults.tabIndicatorOffset
7+
import androidx.compose.runtime.Composable
8+
import androidx.compose.runtime.rememberCoroutineScope
9+
import androidx.compose.ui.Modifier
10+
import androidx.compose.ui.unit.dp
11+
import com.google.accompanist.pager.ExperimentalPagerApi
12+
import com.google.accompanist.pager.HorizontalPager
13+
import com.google.accompanist.pager.PagerState
14+
import com.google.accompanist.pager.rememberPagerState
15+
import kotlinx.coroutines.launch
16+
17+
@OptIn(ExperimentalMaterial3Api::class)
18+
@ExperimentalPagerApi
19+
@Composable
20+
fun PagerContent(content: Map<String, @Composable () -> Unit>) {
21+
22+
val pagerState: PagerState = rememberPagerState(initialPage = 0)
23+
24+
val coroutineScope = rememberCoroutineScope()
25+
26+
val tabList = content.keys.toList()
27+
val pages: List<@Composable () -> Unit> = content.values.toList()
28+
29+
Scaffold(
30+
topBar = {
31+
if(content.size <3){
32+
TabRow(
33+
modifier = Modifier.fillMaxWidth(),
34+
// Our selected tab is our current page
35+
selectedTabIndex = pagerState.currentPage,
36+
// Override the indicator, using the provided pagerTabIndicatorOffset modifier
37+
indicator = { tabPositions: List<TabPosition> ->
38+
TabRowDefaults.Indicator(
39+
modifier = Modifier.tabIndicatorOffset(
40+
tabPositions[pagerState.currentPage]
41+
),
42+
height = 4.dp
43+
)
44+
},
45+
) {
46+
// Add tabs for all of our pages
47+
tabList.forEachIndexed { index, title ->
48+
Tab(
49+
text = { Text(title) },
50+
selected = pagerState.currentPage == index,
51+
onClick = {
52+
coroutineScope.launch {
53+
pagerState.animateScrollToPage(index)
54+
}
55+
}
56+
)
57+
}
58+
}
59+
}else {
60+
ScrollableTabRow(
61+
modifier = Modifier.fillMaxWidth(),
62+
// Our selected tab is our current page
63+
selectedTabIndex = pagerState.currentPage,
64+
// Override the indicator, using the provided pagerTabIndicatorOffset modifier
65+
indicator = { tabPositions: List<TabPosition> ->
66+
TabRowDefaults.Indicator(
67+
modifier = Modifier.tabIndicatorOffset(
68+
tabPositions[pagerState.currentPage]
69+
),
70+
height = 4.dp
71+
)
72+
},
73+
edgePadding = 4.dp
74+
) {
75+
// Add tabs for all of our pages
76+
tabList.forEachIndexed { index, title ->
77+
Tab(
78+
text = { Text(title) },
79+
selected = pagerState.currentPage == index,
80+
onClick = {
81+
coroutineScope.launch {
82+
pagerState.animateScrollToPage(index)
83+
}
84+
}
85+
)
86+
}
87+
}
88+
}
89+
}
90+
) {
91+
HorizontalPager(
92+
modifier = Modifier.padding(it),
93+
state = pagerState,
94+
count = content.size
95+
) { page: Int ->
96+
pages[page].invoke()
97+
98+
}
99+
}
100+
}

app/src/main/java/com/smarttoolfactory/composeimage/demo/ImageScaleDemo.kt renamed to app/src/main/java/com/smarttoolfactory/composeimage/demo/ImageWithConstraintsDemo.kt

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ import com.smarttoolfactory.image.ImageWithConstraints
3333
@Composable
3434
fun ImageWithConstraintsDemo() {
3535

36+
println("🔥 ImageWithConstraintsDemo")
37+
3638
val imageBitmapLarge = ImageBitmap.imageResource(
3739
LocalContext.current.resources, R.drawable.landscape2
3840
)

app/src/main/java/com/smarttoolfactory/composeimage/demo/ThumbnailDemo.kt

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ import com.smarttoolfactory.image.*
3434
@Composable
3535
fun ThumbnailDemo() {
3636

37+
println("🍏 ThumbnailDemo")
38+
3739
val imageBitmapLarge = ImageBitmap.imageResource(
3840
LocalContext.current.resources,
3941
R.drawable.landscape4

app/src/main/java/com/smarttoolfactory/composeimage/demo/zoom/AnimatedZoomDemo.kt

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@ import com.smarttoolfactory.image.zoom.AnimatedZoomLayout
1515
@Composable
1616
fun AnimatedZoomDemo() {
1717

18-
Column(modifier = Modifier.fillMaxSize()) {
18+
println("⛺️ AnimatedZoomDemo")
19+
20+
Column(modifier = Modifier.fillMaxSize().background(Color(0xff607D8B))) {
1921
AnimatedZoomLayout(
2022
modifier = Modifier.fillMaxSize(),
2123
enabled = { zoom, pan, rotation ->
@@ -24,14 +26,14 @@ fun AnimatedZoomDemo() {
2426
) {
2527
Text(
2628
modifier = Modifier
27-
.size(300.dp, height = 400.dp)
28-
.background(Color.Yellow),
29+
.size(300.dp)
30+
.background(Color(0xffE91E63)),
2931
text = "This Composable can be zoomed, rotated, or can moved.\n\n" +
3032
"Also can move back to correct bounds if size \n" +
31-
" of content is passed" +
32-
"as parameter to Modifier.animatedZoom\n\n" +
33-
"Fling gesture when last pointer is up",
34-
fontSize = 20.sp
33+
" of its content is passed " +
34+
"as parameter to Modifier.animatedZoom",
35+
fontSize = 20.sp,
36+
color = Color.White
3537
)
3638
}
3739
}

app/src/main/java/com/smarttoolfactory/composeimage/demo/zoom/EnhancedZoomCropDemo.kt

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,10 @@ import com.smarttoolfactory.image.zoom.rememberEnhancedZoomState
4040
*/
4141
@Composable
4242
fun EnhancedZoomCropDemo() {
43+
44+
println("⛺️ EnhancedZoomCropDemo")
45+
46+
4347
val imageBitmap = ImageBitmap.imageResource(
4448
LocalContext.current.resources,
4549
R.drawable.landscape1

app/src/main/java/com/smarttoolfactory/composeimage/demo/zoom/EnhancedZoomDemo.kt

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,9 @@ import com.smarttoolfactory.image.zoom.rememberEnhancedZoomState
2626
@Composable
2727
fun EnhancedZoomDemo() {
2828

29+
println("⛺️ EnhancedZoomDemo")
30+
31+
2932
Column(
3033
modifier = Modifier
3134
.fillMaxSize()
@@ -40,6 +43,7 @@ fun EnhancedZoomDemo() {
4043

4144
var contentScale by remember { mutableStateOf(ContentScale.Fit) }
4245

46+
Spacer(modifier = Modifier.height(40.dp))
4347
ContentScaleSelectionMenu(contentScale = contentScale) {
4448
contentScale = it
4549
}
@@ -54,22 +58,6 @@ private fun EnhancedZoomableImageSample(imageBitmap: ImageBitmap, contentScale:
5458

5559
TitleMedium(text = "EnhancedZoomableImage")
5660

57-
TitleMedium(text = "clipTransformToContentScale false")
58-
EnhancedZoomableImage(
59-
modifier = Modifier
60-
.background(Color.LightGray)
61-
.fillMaxWidth()
62-
.aspectRatio(4 / 3f),
63-
imageBitmap = imageBitmap,
64-
contentScale = contentScale,
65-
clipTransformToContentScale = false,
66-
enabled = { zoom, pan, rotation ->
67-
(zoom > 1.2f)
68-
}
69-
)
70-
71-
Spacer(modifier = Modifier.height(40.dp))
72-
7361
TitleMedium(
7462
text = "clip = true\n" +
7563
"limitPan = false\n" +

0 commit comments

Comments
 (0)