Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[AND-6] Add edge-to-edge support for apps targeting Android 15 #5469

Open
wants to merge 4 commits into
base: develop
Choose a base branch
from

Conversation

VelikovPetar
Copy link
Contributor

@VelikovPetar VelikovPetar commented Nov 12, 2024

🎯 Goal

Any apps targeting Android 15 (targetSdk=35) have edge-to-edge enabled by default. This means that some screens/components could be obstructed by the system bars / keyboard, making it impossible to interact with. Therefore, we must ensure that the screens we provide from the SDK are supporting edge-to-edge, otherwise integrator apps targeting Android 15 could have issues.

Note 1: This PR DOESN'T change the SDK / sample apps targetSdk value, as that might require other updates. It just makes sure that the affected screens are properly shown in apps targeting Android 15.

Note 2: This PR DOESN'T explicitly introduce edge-to-edge for all screens (for Android version < 15). The only screens where edge-to-edge is explicitly requested are screens which are already simulating such experience by colouring the system/navigation bars (which is now deprecated). In all other cases we try to preserve the current behaviour for Android < 15, and ensure the screens are still shown properly for Android >= 15.

Linear: https://linear.app/stream/issue/AND-6/implement-edge-to-edge-support-for-android-15
GitHub issue: #5458

🛠 Implementation details

ui-common:

  • AttachmentDocumentActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() to ensure the content is not obstructed by status bar / navigation bar.

compose SDK:

  • MediaGalleryPreviewActivity - apply content padding based on WindowInsets.systemBars to ensure the content is not obstructed by status bar / navigation bar + explicitly request enableEdgeToEdge(statusBarStyle, navigationBarStyle) to ensure the system bars are coloured properly (previously we used SystemUiController for that purpose)
  • MediaPreviewActivity - apply content padding based on WindowInsets.systemBars to ensure the content is not obstructed by status bar / navigation bar + explicitly request enableEdgeToEdge(statusBarStyle, navigationBarStyle) to ensure the system bars are coloured properly (previously we used SystemUiController for that purpose). Here, both the background and the system bars are always shown as Color.Black, disregarding light/night mode.

xml SDK:

  • ChannelListActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() to ensure the content is not obstructed by status bar / navigation bar.
  • AttachmentActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() to ensure the content is not obstructed by status bar / navigation bar.
  • AttachmentGalleryActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() to ensure the content is not obstructed by status bar / navigation bar.
  • AttachmentMediaActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() to ensure the content is not obstructed by status bar / navigation bar + explicitly request enableEdgeToEdge(statusBarStyle, navigationBarStyle) to ensure the system bars are coloured properly (previously we used window.navigationBarColor/window.statusBarColor which are now deprecated).
  • MessageListActivity - apply content padding based on WindowInsetsCompat.Type.systemBars() + WindowInsetsCompat.Type.ime(). Ensures that the content is not obstructed by status bar / navigation bar, and ensures that the content is not obstructed by the soft keyboard.

🎨 UI Changes

TargetSdk = 34 (Should look the same before and after the changes)

Screen Before (portrait) Before (landscape) After (portrait) After (landscape)
AttachmentDocumentActivity attachment-document-activity-navbar attachment-document-activity-navbar-lanscape attachment-document-activity-navbar attachment-document-activity-navbar-landscape
MediaGalleryPreviewActivity media-gallery-preview-activity-navbar media-gallery-preview-activity-navbar-landscape media-gallery-preview-activity-navbar media-gallery-preview-activity-navbar-landscape
MediaPreviewActivity media-preview-activity-navbar media-preview-activity-navbar-landscape media-preview-activity-navbar media-preview-activity-navbar-landscape
ChannelListActivity channel-list-activity-navbar channel-list-activity-navbar-landscape channel-list-activity-navbar channel-list-activity-navbar-landscape
AttachmentActivity attachment-activity-navbar attachment-activity-navbar-landscape attachment-activity-navbar attachment-activity-navbar-landscape
AttachmentGalleryActivity attachment-gallery-activity-navbar attachment-gallery-activity-navbar-landscape attachment-gallery-activity-navbar attachment-gallery-activity-navbar-landscape
AttachmentMediaActivity attachment-media-activity-navbar attachment-media-activity-navbar-landscape attachment-media-activity-navbar attachment-media-activity-navbar-landscape
MessageListActivity message-list-activity-navbar message-list-activity-navbar-landscape message-list-activity-navbar message-list-activity-navbar-landscape

TargetSdk = 35 (The components should not be cut-off by the system bars)

Screen Before (portrait) Before (landscape) After (portrait) After (landscape)
AttachmentDocumentActivity attachment-document-activity-navbar attachment-document-activity-navbar-landscape attachment-document-activity-navbar attachment-document-activity-navbar-landscape
MediaGalleryPreviewActivity media-gallery-preview-activity-navbar media-gallery-preview-activity-navbar-landscape media-gallery-preview-activity-navbar media-gallery-preview-activity-navbar-landscape
MediaPreviewActivity media-preview-activity-navbar media-preview-activity-navbar-landscape media-preview-activity-navbar media-preview-activity-navbar-landscape
ChannelListActivity channel-list-activity-navbar channel-list-activity-navbar-landscape channel-list-activity-navbar channel-list-activity-navbar-landscape
AttachmentActivity attachment-activity-navbar attachment-activity-navbar-landscape attachment-activity-navbar attachment-activity-navbar-landscape
AttachmentGalleryActivity attachment-galley-activity-navbar attachment-galley-activity-navbar-landscape attachment-gallery-activity-navbar attachment-gallery-activity-navbar-landscape
AttachmentMediaActivity attachment-media-activity-navbar attachment-media-activity-navbar-landscape attachment-media-activity-navbar attachment-media-activity-navbar-landscape
MessageListActivity message-list-activity-navbar message-list-activity-navbar-landscape messale-list-activity-navbar message-list-activity-navbar-landscape

🧪 Testing

  1. Set Configuration.sampleTargetSdk = 35
  2. Install either ui-components-sample or compose-sample
  3. Open any of the affected screens (Ex. open Image/Audio/Video/PDF attachment) from a channel

☑️Contributor Checklist

General

  • I have signed the Stream CLA (required)
  • Assigned a person / code owner group (required)
  • Thread with the PR link started in a respective Slack channel (#android-chat-core or #android-chat-ui) (required)
  • PR targets the develop branch
  • PR is linked to the GitHub issue it resolves

Code & documentation

  • Changelog is updated with client-facing changes
  • New code is covered by unit tests
  • Comparison screenshots added for visual changes
  • Affected documentation updated (KDocs, docusaurus, tutorial)

☑️Reviewer Checklist

  • UI Components sample runs & works
  • Compose sample runs & works
  • UI Changes correct (before & after images)
  • Bugs validated (bugfixes)
  • New feature tested and works
  • Release notes and docs clearly describe changes
  • All code we touched has new or updated KDocs

🎉 GIF

Please provide a suitable gif that describes your work on this pull request

@VelikovPetar VelikovPetar linked an issue Nov 12, 2024 that may be closed by this pull request
@VelikovPetar VelikovPetar marked this pull request as ready for review November 12, 2024 12:06
@VelikovPetar VelikovPetar requested a review from a team as a code owner November 12, 2024 12:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Deprecated Edge-to-Edge methods usage warning in Play Console
2 participants