Skip to content

Snippets for Styles in Compose#823

Draft
riggaroo wants to merge 25 commits intomainfrom
dac-snippets-styles-documentation-2026-03-03
Draft

Snippets for Styles in Compose#823
riggaroo wants to merge 25 commits intomainfrom
dac-snippets-styles-documentation-2026-03-03

Conversation

@riggaroo
Copy link
Collaborator

@riggaroo riggaroo commented Mar 3, 2026

No description provided.

riggaroo and others added 3 commits March 3, 2026 10:32
- Add `BaseText` and `BaseButton` components implementing `ExperimentalFoundationStyleApi`
- Replace dummy style classes with official `androidx.compose.foundation.style` imports
- Update `StylesSnippets.kt` to use the new `BaseText` and `BaseButton` implementations
- Relocate style snippets to `designsystems.styles` package
- Update `libs.versions.toml` to use `compose-bom-alpha` and remove explicit version overrides for core Compose libraries
@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a comprehensive set of snippets demonstrating the new Style API in Jetpack Compose. It provides practical examples for applying styles to UI components, managing style inheritance and overrides, and implementing complex interactive visual effects. The changes aim to educate developers on effective and flexible styling patterns within Compose, including best practices for design system integration.

Highlights

  • New Compose Styling Snippets: Introduced a comprehensive set of code snippets demonstrating the new Style API in Jetpack Compose, covering various styling techniques and best practices.
  • Core Styling Concepts: Examples illustrate basic style application, combining multiple properties, overwriting styles, merging styles, and understanding parent-child style inheritance and overrides.
  • Advanced Interactive Styles: Showcased complex interactive UI elements, including buttons with hover effects, pressed states, depth animations, and dynamic gradient glows.
  • Design System Integration: Provided guidance on integrating styles within a design system, including custom style extensions, CompositionLocal usage, and recommendations for exposing style parameters in custom components.
  • Gradle Dependency Updates: Updated the Compose Bill of Materials (BOM) to an alpha version and streamlined dependency declarations for several Compose libraries.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog
  • compose/snippets/src/main/java/com/example/compose/snippets/designsystems/styles/StylesSnippets.kt
    • Added numerous Compose styling examples using the new Style API.
    • Included demonstrations of basic styling, merging, overriding, custom extensions, and theme integration.
    • Featured advanced interactive button styles with hover, pressed, depth, and gradient glow effects.
  • compose/snippets/src/main/java/com/example/compose/snippets/designsystems/styles/components/Button.kt
    • Added a BaseButton composable to serve as a foundational component for styling examples.
  • compose/snippets/src/main/java/com/example/compose/snippets/designsystems/styles/components/Text.kt
    • Added a BaseText composable to serve as a foundational component for styling examples.
  • gradle/libs.versions.toml
    • Updated androidx-compose-bom to compose-bom-alpha.
    • Removed explicit version.ref for androidx-compose-foundation, androidx-compose-foundation-layout, androidx-compose-material, and androidx-compose-ui to rely on the BOM.
Activity
  • No activity has been recorded for this pull request yet.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request adds a comprehensive set of snippets for the new Styles API in Jetpack Compose. The examples cover a wide range of use cases from basic styling to advanced animations and theme integration, which will be very helpful for developers.

I've found a couple of critical issues that would prevent compilation, specifically a function redeclaration and incorrect API usage in MyBaseButton. I've also pointed out a deprecated function call and a confusing snippet that could be improved.

After addressing these points, the snippets will be in great shape.


// [START android_compose_styles_dos_wrapper]
@Composable
fun BaseButton(
Copy link
Contributor

Choose a reason for hiding this comment

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

critical

The BaseButton composable is redeclared here, which conflicts with the BaseButton imported from com.example.compose.snippets.designsystems.styles.components.BaseButton (used throughout this file). This will cause a compilation error. Please rename this function to avoid the conflict, for example to BaseButtonSnippet.

Suggested change
fun BaseButton(
fun BaseButtonSnippet(

interactionSource = effectiveInteractionSource,
indication = null,
)
.styleable(styleState, Style, style), // Assuming some base style
Copy link
Contributor

Choose a reason for hiding this comment

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

critical

The styleable modifier expects Style objects as arguments. Here, Style is passed, which is a function reference, not a Style instance. This will cause a compilation error. To pass an empty base style, you should use Style(). The BaseButton in components/Button.kt uses a baseButtonStyle which is an empty style, so for consistency you could also define and use a similar empty base style here.

Suggested change
.styleable(styleState, Style, style), // Assuming some base style
.styleable(styleState, Style(), style), // Assuming some base style

contentAlignment = Alignment.Center
) {
BaseText(
"Button 19".toUpperCase(Locale.current),
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

The String.toUpperCase(Locale) function is deprecated. You should use the String.uppercase() extension function instead. It's recommended to provide a Locale to ensure consistent behavior across different user devices.

Suggested change
"Button 19".toUpperCase(Locale.current),
"Button 19".uppercase(Locale.current),

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.

1 participant