Skip to content

Releases: google/automotive-design-compose

v0.33.0-rc01

17 Jan 16:51
@timothyfroehlich timothyfroehlich
v0.33.0-rc01
e486667
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.33.0-rc01 Pre-release
Pre-release

Main Changes

  • The squoosh code path has been turned on by default, and the option to turn it off has been removed. Several changes to bring the squoosh code path into alignment with the old path have been made.
  • A new DesignScrollCallbacks customization has been added that allows a developer to get the scroll position of a node whenever it changes, or to set the scroll position.

What's Changed

Full Changelog: v0.32.0...v0.33.0-rc01

Contributors

timothyfroehlich, rylin8, and yiqunw700
Assets 5
Loading

v0.32.0

18 Nov 21:25
@timothyfroehlich timothyfroehlich
v0.32.0
3709859
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.32.0 Latest
Latest

What's Changed

New Contributors

Full Changelog: v0.31.0...v0.32.0

Contributors

dipenpradhan, iamralpht, and 4 other contributors
Assets 5
Loading

v0.32.0-rc01

12 Nov 18:00
@timothyfroehlich timothyfroehlich
v0.32.0-rc01
d7a865a
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.32.0-rc01 Pre-release
Pre-release

What's Changed

New Contributors

Full Changelog: v0.31.0...v0.32.0-rc01

Contributors

dipenpradhan, timothyfroehlich, and 2 other contributors
Assets 5
Loading

v0.31.0

07 Oct 18:23
@timothyfroehlich timothyfroehlich
v0.31.0
5b1b4a1
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.31.0

New Features

  • Animation: Enjoy smoother animations as text and vector sizes now scale dynamically during transitions, enhancing visual appeal and user experience. [#1680, #1641]
  • Image Export: Easily export images from Figma designs in various formats, including PNG, JPG, and GIF, streamlining your design workflow. [#1593]

Improvements

  • Localization: The image cache now includes locale information, ensuring that images update correctly when the app language changes. [#1678, #1676]
  • Animation: Individual animation timelines are now supported, allowing for more precise control over animation sequences. [#1580, #1567]
  • User Interface: A new icon button is added to help break strings into two translations, improving text management in the UI. [#1557]

Fixes

  • Fix: Resolve issues with animations defined in Figma by ensuring they use the correct animation specs, enhancing consistency and performance. [#1637, #1636]
  • Fix: Address crashes in component replacement with AndroidView, ensuring a smoother experience when updating .dcf files. [#1604, #1603]
  • Fix: Correct the bitmap cache key for drawable lookups, ensuring images load correctly when changing languages. [#1678, #1676]
Assets 5
Loading

v0.31.0-rc01

30 Sep 16:43
@timothyfroehlich timothyfroehlich
v0.31.0-rc01
5b1b4a1
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.31.0-rc01 Pre-release
Pre-release

What's Changed

Full Changelog: v0.30.0...v0.31.0-rc01

Contributors

timothyfroehlich, dependabot, and 2 other contributors
Assets 5
Loading

v0.30.0

13 Sep 17:52
@timothyfroehlich timothyfroehlich
v0.30.0
7179517
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.30.0

What's Changed

New Contributors

Full Changelog: v0.29.0...v0.30.0

Contributors

oreflow, iamralpht, and 5 other contributors
Assets 5
Loading

v0.30.0-rc02

10 Sep 21:13
@timothyfroehlich timothyfroehlich
v0.30.0-rc02
07479a7
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.30.0-rc02 Pre-release
Pre-release

What's Changed

Full Changelog: v0.30.0-rc01...v0.30.0-rc02

Contributors

timothyfroehlich
Assets 5
Loading

v0.30.0-rc01

28 Aug 15:03
@timothyfroehlich timothyfroehlich
v0.30.0-rc01
5ab32b3
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.30.0-rc01 Pre-release
Pre-release

What's Changed

New Contributors

Full Changelog: v0.29.1...v0.30.0-rc01

Contributors

oreflow, iamralpht, and 5 other contributors
Assets 5
Loading

v0.29.1

26 Jul 15:44
@timothyfroehlich timothyfroehlich
v0.29.1
cd9a8de
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.29.1

DesignCompose 0.29.1 Release Notes

DesignCompose 0.29.1 is a maintenance release that changes the protobuf dependency to protobuf-lite (#1441).

Please see DesignCompose 0.29.0 Release Notes for new features and fixes in 0.29.0.

Full Changelog: v0.29.0...v0.29.1

Assets 5
Loading

v0.29.0

22 Jul 16:48
@timothyfroehlich timothyfroehlich
v0.29.0
2cf118c
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Learn about vigilant mode.
Compare
Choose a tag to compare
v0.29.0

DesignCompose 0.29 Release Notes

DesignCompose 0.29 makes various performance and ergonomic improvements, and introduces several important new features, including Localization, Letter Spacing & Text Decoration, and Rotation Animations (in the Squoosh Renderer Preview). Behind the scenes, the migration to a stable DCF format using protobuf continues, and many dependencies have been updated to ensure that DesignCompose is secure.

API Changes

Use State<T> instead of @Composable() -> T

Using a State<T> can have performance benefits because reading the value out of a State<T> will only cause the closest @Composable function in the call stack to be recomposed. In this release:

  • Visibility can now be customized using State<Boolean>
  • Text can now be customized using State<String> instead of @Composable() -> String
  • Meter (dial, gauge, progress bar) can now be customized using MeterState (as an alias to FloatState, holding a percentage value between 0 and 100) instead of @Composable() -> Meter

The following example illustrates how to use a State<Boolean> as the visibility customization type and a State<String> to replace text in a design element:

@DesignDoc(id = "<your figma doc id>")
interface HelloWorld {
   @DesignComponent(node = "#MainFrame")
   fun MainFrame(
       @Design(node = "#name") showText: State<Boolean>,
       @Design(node = "#name") name: State<String>,
   )
}

val showText = remember { mutableStateOf(true) }
val name = remember { mutableStateOf("World")}
val count = remember { mutableIntStateOf(0) }

LaunchedEffect(Unit) {
   while (true) {
       delay(1000)
       showText.value = !showText.value
       count.intValue += 1
       name.value = "World ${count.intValue}"
   }
}

HelloWorldDoc.MainFrame(showText = showText, name = name)

Because using State is more universal than using a Composable function, we have removed the previous @Composable () -> String customization type.

Localization Support (Preview)

We’ve added initial support for localization in DesignCompose, via a new Figma plugin which works with Android strings.xml resources. Check out our instructions to give it a try:

The Localization plugin extracts strings from a Figma design, and assigns a string resource name for each text node so that DesignCompose can load the appropriate string resource at runtime. You can also use the plugin to exclude particular nodes from the translation process, and upload an existing strings.xml file when creating additional designs for an app. Finally, you can use the plugin to change string resource names, and give string resources description and character limits as hints for the translator.

Any feedback would be greatly appreciated – please file tickets!

Letter Spacing and Text Decoration

Letter spacing, underline, and strikethrough text decorations are now supported.
unnamed

Squoosh Renderer Preview

Variant Custom Animation API

Custom animations can now be programmatically specified in the DesignDocSetting() function that enables the squoosh animation code path. Populate the new customVariantTransition parameter with a function that takes a VariantTransitionContext and returns an AnimationTransition interface. The context provides some data on variant that is changing, and the AnimationTransition needs a function animationSpec() that returns AnimationSpec<Float>. The SmartAnimationTransition is the only supported transition at this time. The easiest way to use this is to use a compose function such as androidx.compose.animation.core.tween.

Here is an example:

DesignDocSettings(
    useSquoosh = true,
    customVariantTransition = { context ->
        if (context.fromComponentSet("MyComponentName")) {
            SmartAnimateTransition(
                tween(
                    durationMillis = (2f * 1000.0).roundToInt(),
                    easing = CubicBezierEasing(0.37f, 0f, 0.63f, 1f)
                )
            )
        } else {
            val mass = 1.0f
            val stiffness = 20.0f
            val critical = sqrt(4.0f * stiffness * mass)
            val damping = 30.0f
            SmartAnimateTransition(
                spring(dampingRatio = damping / critical, stiffness = stiffness)
            )
        }   

    }
)

unnamed (1)

We’re still working on the best way to identify the elements that are being animated. We added functions in VariantTransitionContext that use the node or component name, but this may change in the future.

Rotation Animations

Variants with rotated nodes will now perform rotational animations when switching between them.
unnamed

Token Support

DesignCompose 0.28 added support for Design Tokens, mapped to Figma Variables (check out our docs!). Fetching variables from Figma requires an Enterprise plan, which meant that DesignCompose users on personal plans were unable to use DesignCompose. 0.29 changes this behavior so that users on non-Organization plans can continue to use DesignCompose, but without the variable to token mapping feature.

Assets 5
Loading