b63ee37154
* Update CompanionPane with ComposeTesting * Update ComposeGallery with ComposeTesting * Update ListDetail with ComposeTesting * Update NavigationRail with ComposeTesting * Update TwoPage with ComposeTesting * Update DualView with ComposeTesting * Update ExtendedCanvas with ComposeTesting * Remove TestUtils module * Update wildcard import * Remove the magic number * Fix the ktlint error * Move to JC 1.1.0 * Remove JWM testing dependency * Address comments * Remove customized ViewSize for DualView * Update dependency * Update with ComposeTesting alpha02 |
||
|---|---|---|
| .github/workflows | ||
| CompanionPane | ||
| ComposeGallery | ||
| DualView | ||
| ExtendedCanvas | ||
| ListDetail | ||
| NavigationRail | ||
| TwoPage | ||
| gradle/wrapper | ||
| screenshots | ||
| .gitignore | ||
| CODE_OF_CONDUCT.md | ||
| CONTRIBUTING.md | ||
| LICENSE | ||
| README.md | ||
| SECURITY.md | ||
| SUPPORT.md | ||
| build.gradle | ||
| dependencies.gradle | ||
| gradle.properties | ||
| gradlew | ||
| gradlew.bat | ||
| ktlint.gradle | ||
| settings.gradle | ||
README.md
| page_type | name | languages | products | description | urlFragment | ||
|---|---|---|---|---|---|---|---|
| sample | Surface Duo - Jetpack Compose samples |
|
|
Samples showing how to use Jetpack Compose to achieve dual-screen user interface patterns. | all |
Surface Duo Jetpack Compose Samples
This repo contains samples built with Jetpack Compose for the Microsoft Surface Duo and other large screen and foldable devices. These samples demonstrate our dual-screen user interface patterns with the new UI framework.
Please read the code of conduct and contribution guidelines.
Getting Started
When importing the code samples into Android Studio, use the repository directory as the base directory of the project. This lets you access and run all of the sample modules from within the same project.
To learn how to load apps on the Surface Duo emulator, see the documentation, and follow our blog.
Please check out our page on Jetpack Compose for Microsoft Surface Duo for more details.
Prerequisites
-
Jetpack Compose version:
1.1.0 -
Jetpack WindowManager version:
1.0.0 -
Android Studio version: Bumblebee
2021.1.1
Microsoft Compose Libraries
The samples are built with Microsoft Compose libraries, TwoPaneLayout, WindowState and ComposeTesting.
Contents
| Sample | Description | |
|---|---|---|
| ComposeGallery |  |
Sample with a Microsoft Surface Duo theme that shows how to use the List Detail app pattern. |
| CompanionPane |  |
Photo editor sample that shows how to build the Companion Pane app pattern in Jetpack Compose. |
| ExtendedCanvas |  |
Map sample that shows how to build the Extended Canvas app pattern in Jetpack Compose. |
| ListDetail |  |
Photo gallery sample that shows how to build the List Detail app pattern in Jetpack Compose. |
| DualView |  |
Restaurant finder sample that shows how to build the Dual View app pattern in Jetpack Compose. |
| Two Page |  |
E-reader sample that shows how to build the Two Page app pattern in Jetpack Compose. |
| NavigationRail |  |
Nature-themed sample that shows how to use a combination of NavigationRail and BottomNavigation when building apps for large screen and foldable devices in Jetpack Compose. |
Social links
- video: Jetpack Compose WindowState preview
- blog: Jetpack Compose WindowState preview
- video: Get started with Jetpack Compose Twitch
- blog: Get started with Jetpack Compose
- video: NavigationRail Compose sample Twitch
- blog: NavigationRail Compose sample
- video: TwoPaneLayout Compose library Twitch
- blog: New TwoPaneLayout Compose library preview
- video: Jetpack Compose samples Twitch
- blog: Jetpack Compose foldable and dual-screen development
- blog: Jetpack Compose on Microsoft Surface Duo
Related links
- Surface Duo Compose SDK
- Jetpack Window Manager samples
- SDK samples (Java)
- SDK samples (Kotlin)
- Unity samples
- Xamarin samples
- Flutter samples
- React Native samples
- Web samples
Contributing
This project welcomes contributions and suggestions. Most contributions require you to agree to a Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us the rights to use your contribution. For details, visit https://cla.opensource.microsoft.com.
When you submit a pull request, a CLA bot will automatically determine whether you need to provide a CLA and decorate the PR appropriately (e.g., status check, comment). Simply follow the instructions provided by the bot. You will only need to do this once across all repos using our CLA.
This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.
License
Copyright (c) Microsoft Corporation.
MIT License
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.