Crop image to square by warahiko · Pull Request #952 · DroidKaigi/conference-app-2024

warahiko · 2024-09-03T19:49:43Z

Issue

Overview (Required)

Add CropImageScreen to crop image to square
- There is no design corresponding to this screen, right?
If selected image is not square, transition to CropImageScreen
- otherwise, apply selected image
I tried to implement in iOS, but due to some problems I couldn't complete. So temporarily split process
- in iOS with compose multiplatform, when backing from CropImageScreen, the state of bottom navigation is cleared (app goes to TimeTable)
  - it happens other case, i.e., Contributers, Staff, ....
  - we can continue editing during first time, but not once we create profile
- Simply, it takes time to implement features because I am not familiar with SwiftUI
Multi language support is left due to large diff

Links

Screenshot (Optional if screenshot test is present or unrelated to UI)

see videos

Before	After

Movie (Optional)

Before	After
android_before.mp4	android.mp4

for various images

various_images.mp4

in landscape screen

landscape.mp4

cropping in iOS (currently unavailable due to the above issue)

iOS_crop.mp4

… square

…cropping

warahiko · 2024-09-03T19:54:32Z

+    override fun equals(other: Any?): Boolean {
+        if (this === other) return true
+        if (other == null || this::class != other::class) return false
+
+        other as ProfileImage
+
+        return bytes.contentEquals(other.bytes)
+    }
+
+    override fun hashCode(): Int {
+        return bytes.contentHashCode()
+    }


It is necessary to resolve the warning.

warahiko · 2024-09-03T20:00:32Z

+
+@Composable
+internal fun cropImageScreenPresenter(
+    onConfirm: () -> Unit,


It seems there are no arguments like this in other screens, but I added it because I wanted to transition after event processing.
(Is there another way to achieve this?)

Thank you for asking this. I recommend using this pattern.

conference-app-2024/feature/sessions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/TimetableItemDetailPresenter.kt

Line 73 in 04df9da

shouldGoToFavoriteList = true

Thanks! refactored at e9e04d2.

warahiko · 2024-09-03T20:01:31Z

+                    withContext(Dispatchers.Default) {
+                        croppedProfileImage = requireNotNull(profileImageCandidate).crop(event.rect)
+                    }


Because it can take time to process

This dispatcher might need to be injected...

warahiko · 2024-09-03T20:05:04Z

    val cardUiState: ProfileCardUiState.Card? by rememberUpdatedState(profileCard.toCardUiState())
    var cardError by remember { mutableStateOf(ProfileCardError()) }
-    var uiType: ProfileCardUiType by remember { mutableStateOf(ProfileCardUiType.Loading) }
+    var uiType: ProfileCardUiType by rememberSaveable { mutableStateOf(ProfileCardUiType.Loading) }


To maintain the editing state when backing from CropImageScreen

warahiko · 2024-09-03T20:07:20Z

+    val strokeOuterColor = MaterialTheme.colorScheme.onSurface
+    val strokeInnerColor = MaterialTheme.colorScheme.surface


To ensure the border is not difficult to see if there are images with similar colors to surface/onSurface

takahirom · 2024-09-05T14:07:41Z

@warahiko
The movie looks great! This could take a lot of time! Thank you for your effort. Could you take a look at the format using ./gradlew detekt --auto-correct and the tests?

…aults

warahiko · 2024-09-05T15:28:58Z

@takahirom
Thanks for reviewing!
I checked that the following tasks have passed. Please check.
(Or please tell me other tasks that they should pass.)

./gradlew detekt --auto-correct
./gradlew testDevDebugUnitTest testDebugUnitTest --stacktrace
./gradlew compareRoborazziDebug compareRoborazziDevDebug --stacktrace

takahirom · 2024-09-06T01:40:00Z

+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun CropImageScreen(


It is vital to test this method as we don't want to rely on manual testing. Could you try creating it? I think it is sufficient to check the launch for the first time.

Added at e22abae.

…presenter

github-actions · 2024-09-06T14:34:17Z

Snapshot diff report

File name	Image
CropImageScreenTest[ CropImageScreen - wh en launch - it shoul d show screen]_compa re.png

takahirom · 2024-09-06T14:56:33Z

I tried to implement in iOS, but due to some problems I couldn't complete. So temporarily split process
in iOS with compose multiplatform, when backing from CropImageScreen, the state of bottom navigation is cleared (app goes to TimeTable)
it happens other case, i.e., Contributers, Staff, ....
we can continue editing during first time, but not once we create profile

Thank you for sharing this. I also tried to solve the problem, but we haven't been able to resolve it so far. Although I mentioned creating a test, I think we might not have enough time to ship this by the DroidKaigi. 😭 We might have to solve the problem first
#882

warahiko added 10 commits September 4, 2024 02:49

feat: Define ProfileImage to handle images and their cropping

f2facf2

feat: Enable cropping for ProfileImage

e24fa7e

feat: Calculate size of ProfileImage

8a14a0c

feat: Cache ProfileImage in ProfileCardRepository

8a47e49

feat: Add CropImageScreen and navigate when the selected image is not…

6949bec

… square

feat: Crop image in CropImageScreen and save it to the repository

9c677ac

feat: Apply Cropped image in ProfileCardEditScreen

6c1472a

feat: implement for iOS

f7e92c9

feat: Change to rememberSaveable to retain input inputs during image …

468d810

…cropping

feat: Temporarily split processing between Android and iOS

be8e272

warahiko commented Sep 3, 2024

View reviewed changes

Merge branch 'main' into feature/crop_image

5f5d498

github-actions bot temporarily deployed to deploygate-distribution September 4, 2024 11:43 Inactive

takahirom added the Waiting for response or commit label Sep 5, 2024

warahiko added 5 commits September 5, 2024 23:36

style: Declare properties before methods

320c57a

fix: Incorrect modifier specification

ecd26ce

style: Add trailing comma

1155000

style: Declare parameters without defaults before parameters with def…

3ced7ce

…aults

test: Fix compile error

f90429c

github-actions bot removed the Waiting for response or commit label Sep 5, 2024

github-actions bot temporarily deployed to deploygate-distribution September 5, 2024 23:55 Inactive

takahirom reviewed Sep 6, 2024

View reviewed changes

takahirom added the Waiting for response or commit label Sep 6, 2024

warahiko added 4 commits September 6, 2024 21:07

refactor: Rename eventEmitter -> eventFlow

203d189

refactor: Use a flag in UiState instead of passing a callback to the …

e9e04d2

…presenter

refactor: Rename onConfirm -> onBackWithConfirm

044cb2f

test: Check the launch of CropImageScreen

e22abae

warahiko force-pushed the feature/crop_image branch from 9b0728c to e22abae Compare September 6, 2024 14:16

github-actions bot removed the Waiting for response or commit label Sep 6, 2024

github-actions bot temporarily deployed to deploygate-distribution September 6, 2024 14:24 Inactive

takahirom added the status:blocked ⛔ label Sep 7, 2024

		val strokeOuterColor = MaterialTheme.colorScheme.onSurface
		val strokeInnerColor = MaterialTheme.colorScheme.surface

Conversation

warahiko commented Sep 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Issue

Overview (Required)

Links

Screenshot (Optional if screenshot test is present or unrelated to UI)

Movie (Optional)

Uh oh!

warahiko Sep 3, 2024

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 3, 2024

Choose a reason for hiding this comment

Uh oh!

takahirom Sep 6, 2024

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 6, 2024

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 3, 2024

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 3, 2024

Choose a reason for hiding this comment

Uh oh!

takahirom commented Sep 5, 2024

Uh oh!

warahiko commented Sep 5, 2024

Uh oh!

takahirom Sep 6, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

warahiko Sep 6, 2024

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Sep 6, 2024

Uh oh!

takahirom commented Sep 6, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

warahiko commented Sep 3, 2024 •

edited

Loading

warahiko Sep 3, 2024 •

edited

Loading

takahirom Sep 6, 2024 •

edited

Loading