Code Monkey home page Code Monkey logo

jetpack-compose-playground's Introduction

Jetpack Compose Playground

Introduction ๐Ÿ™‹โ€โ™‚๏ธ

This is an Jetpack Compose example project. I'm collecting a bunch of sample codes for Jetpack Compose. I also collect informations/tutorials on the github page https://foso.github.io/compose.

jCenter PRs Welcome Android Weekly jCenter Tweet

Show some โค๏ธ and star the repo to support the project

GitHub stars GitHub forks GitHub watchers Twitter Follow

Composable of the week!! ๐ŸŽ‰

The BoxWithConstraints

New to Compose?

Check Compose for Android Developers or Hello World Compose

๐Ÿ“™ Jetpack Compose examples/tutorials and demos

Look in the repo or take a look at the github page: https://foso.github.io/compose

Animation

Layouts

Foundation

Material

Cookbook

Some of the code samples in this Repository:

Overview DialogExample CircularProgress
Screenshot Screenshot Screenshot

๐Ÿ  Architecture

๐Ÿ› ๏ธ Built With

Kotlin

jCenter

Project Structure

You need at least version >= Android Studio Arctic Fox to build this project https://developer.android.com/studio/preview/

  • app - Android project directory
  • desktop - an example compose desktop app
  • web - an example compose web app

Resources

Talks

Name Description
Thinking in Compose Jetpack Compose is the new next generation UI toolkit. It uses a declarative component based paradigm for building UIs easily and quickly. Itโ€™s written entirely in Kotlin and embraces the style and ergonomics of the Kotlin language.
Compose by example Jetpack Compose is a new declarative UI toolkit built for the demands of creating modern user interfaces. Get started with Compose and learn about the new APIs and Material components that make up the toolkit by examining concrete UIs weโ€™ve created with it. Weโ€™ll walk through examples of theming, animation, layout and more, demonstrating how to customize and combine components to build real UIs. Weโ€™ll show how the new toolkit simplifies your development experience and enables new possibilities.
Compose for existing apps Jetpack Compose is now in alpha and you might want to start adding it to your existing apps. In this talk, you'll learn how to do that! We'll cover topics such as: adding Compose to your existing Views and embedding Views in Compose, using your existing View theme and current app architecture in Compose, testing all of that code, and much more.
Jetpack Compose Jetpack Compose is Androidโ€™s new modern UI toolkit. Learn how Compose simplifies & accelerates your UI development, allowing you to create richer, more robust and responsive UIs. We outline our roadmap, what is ready for use right now, share our direction in areas that are still evolving, and show how the tight integration with tooling makes the development experience even better. Get up to speed with Compose and how it can help you to build better apps!
droidcon Online 2020: Become A Composer By Brian Gardner
KotlinConf 2019: The Compose Runtime, Demystified by Leland Richardson Jetpack Compose is an ambitious multi-team effort to reimagine Android's UI Toolkit more than 10 years after the Android Platform launched with the original UI Toolkit. Compose follows a declarative programming model, and the runtime is coupled with a Kotlin compiler plugin to enable a novel new approach to declarative programming. In this talk, Leland will go over the mechanics of how the Compose runtime and compiler plugin work together, demystifying how it can be used to enable efficient and performant user interfaces. In addition, this talk will describe how Compose can operate completely independent of the Android Platform and Compose UI, allowing it to be used as a general language feature for Incremental Computing and the management of tree-like data structures.
KotlinConf 2019: Compose Yourself: Designing a Kotlin First UI Toolkit by Anna-Chiara & Clara #Jetpack Compose is an unbundled UI Toolkit for #Android, designed to simplify UI development. It combines a reactive programming model with the conciseness and ease of use of Kotlin. Learn directly from engineers on the project about the decisions that went into making this toolkit and how a Kotlin-first approach has influenced API design from the project's inception.
What's New in Jetpack Compose (Android Dev Summit '19) Jetpack Compose was announced at Google I/O and the team has been hard at work ever since. This talk introduces Compose to new audiences, including what the project is and how it is taking shape. The talk also updates people who already know about Jetpack Compose, including how the project has evolved.
Understanding Compose (Android Dev Summit '19) This session covers the benefits of a declarative reactive UI system like Jetpack Compose and how it applies to real problems that Android developers have today. Additionally, this talk expands on the programming model of Jetpack Compose and some of its implementation details the can help you understand how Compose works.
#AskAndroid at Android Dev Summit 2019 - Jetpack Compose Missed the #AskAndroid livestream segment of Android Dev Summit 2019? Donโ€™t worry, we got you covered. Hosts Lyla Fujiwara and Dan Galpin are joined by Anna-Chiara Bellini and Adam Powell to discuss Jetpack Compose questions submitted by Android developers online. Anna-Chiara Bellini is a product manager, and Adam Powell is an engineering lead.
Google IO19 - Declarative UI patterns Explore how reactive and declarative paradigms can be applied to Android UI development, making it easier for developers to integrate these patterns into their Android apps with Kotlin.
DroidconBerlin - Jetpack Compose โ€” Next Gen Kotlin UI Toolkit for Android
DroidconBerlin - Jumping into Jetpack Compose way too early to see what's inside
KotlinEverywhere - Jetpack Compose
DevFest Kolkata 2019 - Let's Talk Composing UI

Podcasts

Name Description
Android Developer backstage - Episode 147: Jetpack Compose Alpha
Android Developers Backstage : Episode 131: Jetpack Compose and Declarative UIs
Android Developer backstage - Episode 115: Jetpack Compose
Fragmented Podcast - Episode 171: Jetpack Compose with Leland Richardson
Google podcast - Romain Guy โ€“ Podcast S09 E09

Other Links

Name Description
Jetpack Compose
Jetpack Compose UI Readme
Compose Readme
Video - Kotlin and Jetpack Compose
#compose channel on Kotlin Slack
Compose from first Principles
Jetpack Compose Tutorial
AndroidX Git Compose
Release Notes
Compse UI Docu
Video - Jetpack compose - MVVM State management in a simple way
Jetpack Compose Twitter Bot

Feel free to contribute!

โœ๏ธ Feedback

If you want to improve Compose, join the Kotlin Slack and the #compose channel or file a bug at https://issuetracker.google.com/issues?q=componentid:612128

๐Ÿ“œ License

This project is licensed under the MIT License - see the LICENSE.md file for details

Find this project useful ? โค๏ธ

  • Support it by clicking the โญ button on the upper right of this page. โœŒ๏ธ

License

MIT License

Copyright (c) 2019 Jens Klingenberg

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Acknowledgments

Projects that helped me understand how to setup the project:

jetpack-compose-playground's People

Contributors

foso avatar jensklingenbergedeka avatar whitescent avatar jocmp avatar natanfudge avatar nachtien avatar farhanroy avatar etiennept avatar vipulasri avatar wise4rmgod avatar nikit19 avatar maikotrindade avatar jadyli avatar shinhyo avatar tatsuyafujisaki avatar sunny52525 avatar stefma avatar peterfortuin avatar oussamahaff avatar noloman avatar lnlou avatar kgdobariya avatar jschmid avatar johnnylambada avatar yujinyan avatar gurupreet avatar ebinjoy999 avatar rurimo avatar yektadev avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.