[C+ Checklist Needs Completion] [$250] IOS - Avatar doesn't get back to its original center position after zooming in and out

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: 9.0.70-2
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://expensify.testrail.io/index.php?/tests/view/5291133
Email or phone of affected tester (no customers): nathanmulugetatesting+2272@gmail.com
Issue reported by: Applause - Internal Team

Action Performed:

Open hybrid app
Upload a custom avatar for your profile
Open your self DM
Open the avatar to show in full screen
Pinch out to zoom and without releasing our finger pinch in to zoom out and position your fingers to the corner while zooming out and release your fingers

Expected Result:

The position of the avatar gets back to its original center position

Actual Result:

The avatar stays at the position it was released on and doesn't get back to the center

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

Screenshots/Videos

Add any screenshot/video evidence

Bug6683084_1733231204767.ScreenRecording_12-03-2024_15-58-36_1.1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~021863989062279850488
Upwork Job ID: 1863989062279850488
Last Price Increase: 2025-02-03
Automatic offers:

dominictb | Contributor | 106011607

@greg-schroeder

Triggered auto assignment to @greg-schroeder (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

Job added to Upwork: https://www.upwork.com/jobs/~021863989062279850488

@abdulrahuman5196

Triggered auto assignment to Contributor-plus team member for initial proposal review - @abdulrahuman5196 (External)

Upwork job price has been updated to $125

Hi! I came across your job posting on Upwork regarding the avatar centering issue in your iOS app. After analyzing the problem where the avatar doesn't return to center after zoom gestures, I believe this can be fixed effectively through iterative solutions. I am a full time full stack iOS developer, designer and game developer at MagicHabits. This can be fixed in max 1-2 days.

Based on my experience with iOS gesture handling and UI animations, I've identified 5 potential approaches that could solve this:

Spring Animation Reset

swiftCopyUIView.animate(withSpringDamping: 0.8) {
avatarImageView.center = view.center
}

Velocity-Based Repositioning

swiftCopylet velocity = gesture.velocity(in: view)
let newCenter = calculatePosition(from: velocity)
animateToPosition(newCenter)

Smart Edge Detection

swiftCopyif !safeBounds.contains(avatar.frame) {
returnToCenter(animated: true)
}

Progressive Center Force

swiftCopylet centerForce = 1 - currentScale
let newCenter = interpolate(current: position,
target: center,
force: centerForce)

Physics-Based Boundaries

swiftCopylet behavior = UIAttachmentBehavior(item: avatarImageView)
animator.addBehavior(behavior)
Most natural but complex implementation
Recommended Approach:

I suggest implementing Solution #1 (Spring Animation Reset) first, then enhancing it with elements of Solution #4 (Progressive Center Force). This combination would:

Provide immediate improvement in UX
Feel natural and iOS-native
Be quick to implement and test
Allow for easy tuning of behavior

Let me know if you like it so I can submit a proposal on upwork!

@ahmedkhan28

📣 @ahmedkhan28! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

Make sure you've read and understood the contributing guidelines.
Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.

Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

Contributor details
Your Expensify account email: ahmedkhan850@gmail.com
Upwork Profile Link: www.upwork.com/agencies/1838604427293852717

Will process today

@bernhardoj

Payment summary:

Contributor: @bernhardoj - $250 - ND
C+: @dominictb - $250 - Upwork

@dominictb

Can you take care of the C+ checklist @dominictb? Thanks

BugZero Checklist:

[Contributor] Classify the bug:

Bug classification

Source of bug:

1a. Result of the original design (eg. a case wasn't considered)
1b. Mistake during implementation
1c. Backend bug
1z. Other:

Where bug was reported:

2a. Reported on production
2b. Reported on staging (deploy blocker)
2c. Reported on a PR
2z. Other:

Who reported the bug:

[Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

Link to comment: https://github.com/Expensify/App/pull/33756/files#r1967696226
[Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

Link to discussion: N/A
[Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again. Yes

Regression Test Proposal

Test:

Prerequisite: have a custom profile avatar

Open a chat where you can see your own avatar (e.g., self dm, workspace chat)
Open the avatar in an attachment modal
Zoom in the avatar
Drag left/right
Zoom out until the avatar image is fully visible
Verify the avatar goes back to the center

Do we agree 👍 or 👎

@greg-schroeder

@greg-schroeder done

Requested in ND.

filed

@bernhardoj

$250 approved for @bernhardoj

Navigation Menu

Repository navigation

[C+ Checklist Needs Completion] [$250] IOS - Avatar doesn't get back to its original center position after zooming in and out #53471

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

119 remaining items

BugZero Checklist:

Regression Test Proposal

Test:

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[C+ Checklist Needs Completion] [$250] IOS - Avatar doesn't get back to its original center position after zooming in and out #53471

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Activity

melvin-bot commented on Dec 3, 2024

melvin-bot commented on Dec 3, 2024

melvin-bot commented on Dec 3, 2024

melvin-bot commented on Dec 3, 2024

ahmedkhan28 commented on Dec 4, 2024

melvin-bot commented on Dec 4, 2024

ahmedkhan28 commented on Dec 4, 2024

119 remaining items

greg-schroeder commented on Feb 24, 2025

greg-schroeder commented on Feb 24, 2025

greg-schroeder commented on Feb 24, 2025

dominictb commented on Feb 24, 2025

BugZero Checklist:

Regression Test Proposal

Test:

dominictb commented on Feb 24, 2025

bernhardoj commented on Feb 25, 2025

greg-schroeder commented on Feb 27, 2025

JmillsExpensify commented on Mar 3, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions