Skip to content

🔧 [ShareableCardContent] Fixed so that profile photos are always output at a fixed size, regardless of the device's resolution, portrait or landscape orientation.#893

Merged
takahirom merged 3 commits intoDroidKaigi:mainfrom
Corvus400:design/fix_profile_card_export_size
Sep 1, 2024
Merged

🔧 [ShareableCardContent] Fixed so that profile photos are always output at a fixed size, regardless of the device's resolution, portrait or landscape orientation.#893
takahirom merged 3 commits intoDroidKaigi:mainfrom
Corvus400:design/fix_profile_card_export_size

Conversation

@Corvus400
Copy link
Contributor

@Corvus400 Corvus400 commented Aug 31, 2024

Issue

Overview (Required)

  • Until now, the size of the image output by the profile card has varied depending on the resolution of the device each person is using.
  • By incorporating this change to the repository, the image will be output at the size and position as designed, regardless of the resolution of the device or whether it is in portrait or landscape mode.

Links

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

Small Phone Pixel 7 Pro
Pixel 2 Pixel 3a
Pixel 3 XL Pixel 8 Pro

@github-actions github-actions bot temporarily deployed to deploygate-distribution August 31, 2024 00:15 Inactive
Box(
contentAlignment = Alignment.Center,
modifier = modifier
.requiredSize(
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • On small devices like the SmallPhone, the resolution will be smaller than the specified size, so even if you specify 1200, the width will be adjusted to 720.
  • So, we use requiredSize to ignore the width of the device and force the width to be 1200.

@github-actions
Copy link

Snapshot diff report

File name Image
ShareableCardPreview
_compare.png

@Corvus400 Corvus400 changed the title [WIP][ShareableCardContent] 🔧 Fixed so that the profile picture is always output at a fixed size, regardless of the device's resolution. [ShareableCardContent] 🔧 Fixed so that the profile picture is always output at a fixed size, regardless of the device's resolution. Aug 31, 2024
@Corvus400 Corvus400 marked this pull request as ready for review August 31, 2024 00:53
Comment on lines +91 to +92
val widthPx = 1200
val heightPx = 630
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

スクリーンショット 2024-08-31 10 06 40

Comment on lines +93 to +94
val cardWidthPx = 300
val cardHeightPx = 380
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

スクリーンショット 2024-08-31 10 06 48

@Corvus400 Corvus400 changed the title [ShareableCardContent] 🔧 Fixed so that the profile picture is always output at a fixed size, regardless of the device's resolution. [ShareableCardContent] 🔧 Fixed so that profile photos are always output at a fixed size, regardless of the device's resolution, portrait or landscape orientation. Aug 31, 2024
@github-actions github-actions bot temporarily deployed to deploygate-distribution August 31, 2024 03:18 Inactive
Comment on lines +95 to +98
val offsetXBackPx = 148f
val offsetYBackPx = 76f
val offsetXFrontPx = -136f
val offsetYFrontPx = -61f
Copy link
Contributor Author

@Corvus400 Corvus400 Aug 31, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

9c739f4

There was a slight discrepancy between the figures, so I adjusted the values.
The result of the superimposition is as follows.
Now it is almost impossible to notice the discrepancy with the naked eye.

OGP Overlay Exported image

@Corvus400 Corvus400 changed the title [ShareableCardContent] 🔧 Fixed so that profile photos are always output at a fixed size, regardless of the device's resolution, portrait or landscape orientation. 🔧 [ShareableCardContent] Fixed so that profile photos are always output at a fixed size, regardless of the device's resolution, portrait or landscape orientation. Aug 31, 2024
@takahirom takahirom added the awesome Label for project-applicable insights or remarkable technologies. label Sep 1, 2024
Copy link
Member

@takahirom takahirom left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! Thank you for your detailed pull request.

@takahirom takahirom merged commit 3f46d50 into DroidKaigi:main Sep 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

awesome Label for project-applicable insights or remarkable technologies.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

On devices with a small width, the shared image in the profile card will be something unintended.

2 participants