├── .gitignore ├── LICENSE ├── README.md ├── app ├── .gitignore ├── build.gradle ├── proguard-rules.pro └── src │ ├── androidTest │ └── java │ │ └── com │ │ └── lahsuak │ │ └── apps │ │ └── jetpackcomposebasic │ │ └── ExampleInstrumentedTest.kt │ ├── main │ ├── AndroidManifest.xml │ ├── java │ │ └── com │ │ │ └── lahsuak │ │ │ └── apps │ │ │ └── jetpackcomposebasic │ │ │ ├── MainActivity.kt │ │ │ └── ui │ │ │ └── theme │ │ │ ├── Color.kt │ │ │ ├── Theme.kt │ │ │ └── Type.kt │ └── res │ │ ├── drawable-v24 │ │ └── ic_launcher_foreground.xml │ │ ├── drawable │ │ └── ic_launcher_background.xml │ │ ├── mipmap-anydpi-v26 │ │ ├── ic_launcher.xml │ │ └── ic_launcher_round.xml │ │ ├── mipmap-hdpi │ │ ├── ic_launcher.webp │ │ └── ic_launcher_round.webp │ │ ├── mipmap-mdpi │ │ ├── ic_launcher.webp │ │ └── ic_launcher_round.webp │ │ ├── mipmap-xhdpi │ │ ├── ic_launcher.webp │ │ └── ic_launcher_round.webp │ │ ├── mipmap-xxhdpi │ │ ├── ic_launcher.webp │ │ └── ic_launcher_round.webp │ │ ├── mipmap-xxxhdpi │ │ ├── ic_launcher.webp │ │ └── ic_launcher_round.webp │ │ ├── values │ │ ├── colors.xml │ │ ├── strings.xml │ │ └── themes.xml │ │ └── xml │ │ ├── backup_rules.xml │ │ └── data_extraction_rules.xml │ └── test │ └── java │ └── com │ └── lahsuak │ └── apps │ └── jetpackcomposebasic │ └── ExampleUnitTest.kt ├── build.gradle ├── gradle.properties └── settings.gradle /.gitignore: -------------------------------------------------------------------------------- 1 | *.iml 2 | .gradle 3 | /local.properties 4 | /.idea/caches 5 | /.idea/libraries 6 | /.idea/modules.xml 7 | /.idea/workspace.xml 8 | /.idea/navEditor.xml 9 | /.idea/assetWizardSettings.xml 10 | .DS_Store 11 | /build 12 | /captures 13 | .externalNativeBuild 14 | .cxx 15 | local.properties 16 | 17 | gradlew 18 | .idea 19 | gradlew.bat 20 | gradle 21 | 22 | # Add any directories, files, or patterns you don't want to be tracked by version control 23 | # Built application files 24 | *.apk 25 | *.ap_ 26 | *.aab 27 | output-metadata.json 28 | 29 | # Files for the ART/Dalvik VM 30 | *.dex 31 | 32 | # Java class files 33 | *.class 34 | 35 | # Generated files 36 | bin/ 37 | gen/ 38 | out/ 39 | 40 | # Gradle files 41 | .gradle/ 42 | build/ 43 | 44 | # Proguard folder generated by Eclipse 45 | proguard/ 46 | 47 | # Log Files 48 | *.log 49 | 50 | # Android Studio Navigation editor temp files 51 | .navigation/ 52 | 53 | # Android Studio captures folder 54 | captures/ 55 | 56 | .idea/ 57 | 58 | # Keystore files 59 | # Uncomment the following line if you do not want to check your keystore files in. 60 | #*.jks 61 | 62 | 63 | # Freeline 64 | freeline.py 65 | freeline/ 66 | freeline_project_description.json 67 | 68 | # fastlane 69 | fastlane/report.xml 70 | fastlane/Preview.html 71 | fastlane/screenshots 72 | fastlane/test_output 73 | fastlane/readme.md 74 | 75 | 76 | # Proguard related files 77 | seeds.txt 78 | usage.txt 79 | mapping.txt 80 | config.txt 81 | 82 | # Temp stacktrace file 83 | stacktrace.txt 84 | 85 | #amplify 86 | amplify/\#current-cloud-backend 87 | amplify/.config/local-* 88 | amplify/mock-data 89 | amplify/backend/amplify-meta.json 90 | amplify/backend/awscloudformation 91 | dist/ 92 | node_modules/ 93 | aws-exports.js 94 | awsconfiguration.json 95 | amplifyconfiguration.json 96 | amplify-build-config.json 97 | amplify-gradle-config.json 98 | amplifytools.xcconfig 99 | 100 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 Kaushal Vasava 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # JetPackCompose Basic to Intermediate 2 | 3 | # Introduction 4 | This repository is useful for learning basic to intermediate levels of Jetpack compose. Jetpack Compose (JC) is a modern UI development toolkit. It serves as a beginner-friendly project, providing an introduction to Jetpack Compose for newcomers and going up to the Intermediate level. 5 | 6 | UI : You will learn how Compose basic UI element works. Like how to add image, text, list, how to scroll layout, about theming, animations and colors, etc. 7 | 8 | State : You will learn how state management of UI element works in compose. learn about state handling 9 | when configuration change, during recomposition and how to use state variable for state-hoisting to re-use 10 | Stateless compose element. 11 | 12 | # Here you will learn 13 | - What is composable function? (BRANCH-1) 14 | - How you can build simple and basic ui elements(composable in JC)(views in xml)? (BRANCH-3) 15 | - How you can build simple screen with these composable? (BRANCH-3) 16 | - What is recomposition and How it works? (BRANCH-4) 17 | - What is State in JC? (BRANCH-4) 18 | - What is State hoisting. (BRANCH-4) 19 | - How to reuse composable to build complex ui? (BRANCH-3,4,5) 20 | - What is LazyRow, LazyColumn and how it works? (ie.Recyclerview in xml) (BRANCH-5) 21 | - How to make animation in JC? (BRANCH-6) 22 | - ViewPager, Card, TabLayout in JC (BRANCH-7, BOTTOM_VIEWPAGER, TAB_LAYOUT) 23 | - How to create Widget in Jetpack Compose? (BRANCH- ADD_WIDGET) 24 | - How to create bottom navigation bar in Jetpack compose? (BRANCH - bottom_nav) 25 | - How to create simple timer app with canvas? (BRANCH - timer) 26 | - Build complex mediation ui. (BRANCH - meditation_ui) 27 | - News app using these concepts and also use MVVM architecture, Rest API, Retrofit, Coil for Image loading, Navigation, Testing API in JC. (BRANCH-NEWS_APP) 28 | - Add Text style using shape and animation to text. (BRANCH - text-styling) 29 | - Navigate back with next screen to previous screen. (BRANCH - navigate-back-with-result) 30 | - How to implement Drag-N-Drop in Jetpack compose. (BRANCH- drag-and-drop) 31 | 32 | # Topics 33 | - What is Jetpack compose?: 34 | 35 | Jetpack Compose is a modern toolkit for building native Android UI. Jetpack Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs. 36 | 37 | - Composable functions: 38 | 39 | Jetpack Compose is built around composable functions. These functions let you define your app's UI programmatically by describing how it should look and providing data dependencies, rather than focusing on the process of the UI's construction (initializing an element, attaching it to a parent, etc.). To create a composable function, just add the @Composable annotation to the function name. 40 | More info 👉 https://developer.android.com/jetpack/compose/tutorial#lesson-1:-composable-functions 41 | 42 | - Layouts: 43 | 44 | UI elements are hierarchical, with elements contained in other elements. In Compose, you build a UI hierarchy by calling composable functions from other composable functions. 45 | 46 | - Lists and animations: 47 | 48 | Lists and animations are everywhere in apps. In this lesson, you will learn how Compose makes it easy to create lists and fun to add animations. 49 | More info 👉 https://developer.android.com/jetpack/compose/lists 50 | 51 | - Navigation: 52 | 53 | The Navigation component provides support for Jetpack Compose applications. You can navigate between composable while taking advantage of the Navigation component’s infrastructure and features. 54 | 55 | More info 👉 https://developer.android.com/jetpack/compose/navigation 56 | 57 | # Android components used: 58 | - Jetpack compose for UI development 59 | - Kotlin for programming 60 | - MVVM architecture 61 | - Coil library for dynamic Image loading 62 | - Retrofit for REST API data consuming 63 | - Jetpack compose Navigation 64 | - Lazy list, Card, Other composable functions 65 | - Unit Testing of API 66 | - Animations 67 | - Viewpager 68 | - Bottomsheet 69 | - Tab layout 70 | - State managements 71 | - Drag-Drop 72 | 73 | # Branches Info: 74 | #1_composable_function_info : 75 | How composable function works is show in this branch code and how recomposition works in jetpack compose. 76 | 77 | #3_add_rows_and_columns: 78 | Add Row and column to create complex layout in compose. 79 | 80 | #4_state_of_composable: 81 | State of composable is good topic to learn in detail because of it you will find difficulty in recomposition. 82 | 83 | #5_add_lazy_list_aka_recyclerview: 84 | Lazy row and lazy column is like horizontal and vertical recyclerview but easy way to implement scrolling behaviour in compose. 85 | 86 | #6_add_animation_and_theme: 87 | Add animation when composable element state changes. 88 | 89 | #7_add_card_composable: 90 | Add Card composable or custom composable to make UI better. 91 | 92 | #bottom_viewpager: 93 | It is a viewpager in Jetpack compose. 94 | 95 | #tab-layout: 96 | Tab layout in Jetpack compose. 97 | 98 | #Constraint-layout: 99 | Use Constaint layout to make Indian flag. 100 | 101 | #add_widget: 102 | Create Simple counter widget in JC. 103 | 104 | #bottom_nav_bar: 105 | Created botttom navigation bar. 106 | 107 | #meditation_ui: 108 | Created complex UI 109 | 110 | #timer: 111 | Created timer app 112 | 113 | #news-app: 114 | News app using Retrofit, MVVM architecture, Compose, Navigation, Lazy list etc. 115 | 116 | #text-styling 117 | Add Text stlying and animations 118 | 119 | #navigate-back-with-result 120 | Navigate back with next screen to previous screen 121 | 122 | #drag-and-drop 123 | Drag and Drop Functionality 124 | more info: https://developer.android.com/jetpack/compose/touch-input/pointer-input/drag-swipe-fling 125 | 126 | # Screenshots & Videos: 127 | 128 | ![Screenshot_2023-07-20-22-40-57-132_com lahsuak apps jetpackcomposebasic](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/8dd37cc0-45fe-42a4-b9e0-f598adbf2ba7) 129 | ![Screenshot_2023-07-20-22-40-52-894_com lahsuak apps jetpackcomposebasic](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/07bc6301-dc44-46d4-a5f6-e667f86481a2) 130 | ![Screenshot_2023-07-20-22-41-19-897_com lahsuak apps jetpackcomposebasic](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/f560be8b-6ddc-4d9a-8b3e-99ac0bcffcd4) 131 | ![Screenshot 2023-07-25 155236](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/249576b5-e9f5-4d04-9f10-0f032b02693c) 132 | ![Screenshot 2023-08-01 185044](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/9c6019df-8195-41ee-8a7d-0e8df8bd1f3d) 133 | 134 | Lazy column with animations 135 | 136 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/7e92754d-b7d8-4b93-bdf2-5b06d30c2d00 137 | 138 | NewsApp 139 | 140 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/b28eeb2a-fb6a-43bd-9823-dedb83f4cfab 141 | 142 | Timer 143 | 144 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/b77cb850-f710-4155-9500-961bca5413eb 145 | 146 | Bottom Navigation Bar 147 | 148 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/2cf7f449-08f7-4973-a8f0-46e7b5dcc4f8 149 | 150 | Tab layout 151 | 152 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/2ec0b2f2-5ecd-43f7-ac8a-77d092664cf2 153 | 154 | Viewpager 155 | 156 | [Screen_recording_20230801_184816.webm](https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/1efc21d0-e5db-4d2c-b7e3-aeb67ff19235) 157 | 158 | Text Styling 159 | 160 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/6de7f19b-e2b5-48ab-a7c0-ec46d593e3cb 161 | 162 | Navigate back with result 163 | 164 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/1d96d44f-66e1-4f3b-bba1-2844ab6553cc 165 | 166 | Drag-n-Drop 167 | 168 | https://github.com/KaushalVasava/JetPackCompose_Basic/assets/49050597/2106c5e9-cd1b-41e0-a721-e481c258756d 169 | 170 | # Support Me 171 | If you like my work you can support me via : 172 | 173 | [![buymecoffee1 (2)](https://github.com/KaushalVasava/Tasks/assets/49050597/327844b7-b9a4-4c5d-beb7-e9e177c82880)](https://www.buymeacoffee.com/kaushal.developer) 174 | 175 | # Contribution 176 | You can contribute this project. Just Solve issue or update code and raise PR. I'll do code review and merge your changes into main branch. See Commit message guidelines https://initialcommit.com/blog/git-commit-messages-best-practices 177 | 178 | # Licence 179 | MIT License 180 | 181 | Copyright (c) 2024 Kaushal Vasava 182 | 183 | Permission is hereby granted, free of charge, to any person obtaining a copy 184 | of this software and associated documentation files (the "Software"), to deal 185 | in the Software without restriction, including without limitation the rights 186 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 187 | copies of the Software, and to permit persons to whom the Software is 188 | furnished to do so, subject to the following conditions: 189 | 190 | The above copyright notice and this permission notice shall be included in all 191 | copies or substantial portions of the Software. 192 | 193 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 194 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 195 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 196 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 197 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 198 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 199 | SOFTWARE. 200 | 201 | # Author 202 | Kaushal Vasava 203 | 204 | If you like my work then Follow me on LinkedIn, Twitter for more information related to app development, Kotlin, etc and Add to Favorite on Github . 205 | -------------------------------------------------------------------------------- /app/.gitignore: -------------------------------------------------------------------------------- 1 | /build -------------------------------------------------------------------------------- /app/build.gradle: -------------------------------------------------------------------------------- 1 | plugins { 2 | id 'com.android.application' 3 | id 'org.jetbrains.kotlin.android' 4 | } 5 | 6 | android { 7 | namespace 'com.lahsuak.apps.jetpackcomposebasic' 8 | compileSdk 34 9 | 10 | defaultConfig { 11 | applicationId "com.lahsuak.apps.jetpackcomposebasic" 12 | minSdk 23 13 | targetSdk 34 14 | versionCode 1 15 | versionName "1.0" 16 | 17 | testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner" 18 | vectorDrawables { 19 | useSupportLibrary true 20 | } 21 | } 22 | 23 | buildTypes { 24 | release { 25 | minifyEnabled false 26 | proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro' 27 | } 28 | } 29 | compileOptions { 30 | sourceCompatibility JavaVersion.VERSION_17 31 | targetCompatibility JavaVersion.VERSION_17 32 | } 33 | kotlinOptions { 34 | jvmTarget = '17' 35 | } 36 | buildFeatures { 37 | compose true 38 | } 39 | composeOptions { 40 | kotlinCompilerExtensionVersion '1.4.3' 41 | } 42 | packagingOptions { 43 | resources { 44 | excludes += '/META-INF/{AL2.0,LGPL2.1}' 45 | } 46 | } 47 | } 48 | 49 | dependencies { 50 | 51 | implementation 'androidx.core:core-ktx:1.10.1' 52 | implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.6.1' 53 | implementation 'androidx.activity:activity-compose:1.7.2' 54 | implementation "androidx.compose.ui:ui:$compose_version" 55 | implementation "androidx.compose.ui:ui-tooling-preview:$compose_version" 56 | implementation 'androidx.compose.material3:material3:1.2.0-alpha03' 57 | testImplementation 'junit:junit:4.13.2' 58 | androidTestImplementation 'androidx.test.ext:junit:1.1.5' 59 | androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1' 60 | androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_version" 61 | debugImplementation "androidx.compose.ui:ui-tooling:$compose_version" 62 | debugImplementation "androidx.compose.ui:ui-test-manifest:$compose_version" 63 | } -------------------------------------------------------------------------------- /app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # You can control the set of applied configuration files using the 3 | # proguardFiles setting in build.gradle. 4 | # 5 | # For more details, see 6 | # http://developer.android.com/guide/developing/tools/proguard.html 7 | 8 | # If your project uses WebView with JS, uncomment the following 9 | # and specify the fully qualified class name to the JavaScript interface 10 | # class: 11 | #-keepclassmembers class fqcn.of.javascript.interface.for.webview { 12 | # public *; 13 | #} 14 | 15 | # Uncomment this to preserve the line number information for 16 | # debugging stack traces. 17 | #-keepattributes SourceFile,LineNumberTable 18 | 19 | # If you keep the line number information, uncomment this to 20 | # hide the original source file name. 21 | #-renamesourcefileattribute SourceFile -------------------------------------------------------------------------------- /app/src/androidTest/java/com/lahsuak/apps/jetpackcomposebasic/ExampleInstrumentedTest.kt: -------------------------------------------------------------------------------- 1 | package com.lahsuak.apps.jetpackcomposebasic 2 | 3 | import androidx.test.platform.app.InstrumentationRegistry 4 | import androidx.test.ext.junit.runners.AndroidJUnit4 5 | 6 | import org.junit.Test 7 | import org.junit.runner.RunWith 8 | 9 | import org.junit.Assert.* 10 | 11 | /** 12 | * Instrumented test, which will execute on an Android device. 13 | * 14 | * See [testing documentation](http://d.android.com/tools/testing). 15 | */ 16 | @RunWith(AndroidJUnit4::class) 17 | class ExampleInstrumentedTest { 18 | @Test 19 | fun useAppContext() { 20 | // Context of the app under test. 21 | val appContext = InstrumentationRegistry.getInstrumentation().targetContext 22 | assertEquals("com.lahsuak.apps.jetpackcomposebasic", appContext.packageName) 23 | } 24 | } -------------------------------------------------------------------------------- /app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 15 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /app/src/main/java/com/lahsuak/apps/jetpackcomposebasic/MainActivity.kt: -------------------------------------------------------------------------------- 1 | package com.lahsuak.apps.jetpackcomposebasic 2 | 3 | import android.os.Bundle 4 | import androidx.activity.ComponentActivity 5 | import androidx.activity.compose.setContent 6 | import androidx.compose.foundation.layout.fillMaxSize 7 | import androidx.compose.material3.MaterialTheme 8 | import androidx.compose.material3.Surface 9 | import androidx.compose.material3.Text 10 | import androidx.compose.runtime.Composable 11 | import androidx.compose.ui.Modifier 12 | import androidx.compose.ui.tooling.preview.Preview 13 | import com.lahsuak.apps.jetpackcomposebasic.ui.theme.JetPackComposeBasicTheme 14 | 15 | class MainActivity : ComponentActivity() { 16 | override fun onCreate(savedInstanceState: Bundle?) { 17 | super.onCreate(savedInstanceState) 18 | setContent { 19 | JetPackComposeBasicTheme { 20 | // A surface container using the 'background' color from the theme 21 | Surface( 22 | modifier = Modifier.fillMaxSize(), 23 | color = MaterialTheme.colorScheme.background 24 | ) { 25 | Greeting("Android") 26 | } 27 | } 28 | } 29 | } 30 | } 31 | /*** 32 | Composable functions : 33 | A composable function is a regular function annotated with @Composable. 34 | This enables your function to call other @Composable functions within it. 35 | You can see how the Greeting function is marked as @Composable. 36 | This function will produce a piece of UI hierarchy displaying the given input, 37 | String. Text is a composable function provided by the library. 38 | ***/ 39 | @Composable 40 | fun Greeting(name: String) { 41 | Text(text = "Hello $name!") 42 | } 43 | 44 | @Preview(showBackground = true) 45 | @Composable 46 | fun DefaultPreview() { 47 | JetPackComposeBasicTheme { 48 | Greeting("Android") 49 | } 50 | } -------------------------------------------------------------------------------- /app/src/main/java/com/lahsuak/apps/jetpackcomposebasic/ui/theme/Color.kt: -------------------------------------------------------------------------------- 1 | package com.lahsuak.apps.jetpackcomposebasic.ui.theme 2 | 3 | import androidx.compose.ui.graphics.Color 4 | 5 | val Purple80 = Color(0xFFD0BCFF) 6 | val PurpleGrey80 = Color(0xFFCCC2DC) 7 | val Pink80 = Color(0xFFEFB8C8) 8 | 9 | val Purple40 = Color(0xFF6650a4) 10 | val PurpleGrey40 = Color(0xFF625b71) 11 | val Pink40 = Color(0xFF7D5260) -------------------------------------------------------------------------------- /app/src/main/java/com/lahsuak/apps/jetpackcomposebasic/ui/theme/Theme.kt: -------------------------------------------------------------------------------- 1 | package com.lahsuak.apps.jetpackcomposebasic.ui.theme 2 | 3 | import android.app.Activity 4 | import android.os.Build 5 | import androidx.compose.foundation.isSystemInDarkTheme 6 | import androidx.compose.material3.MaterialTheme 7 | import androidx.compose.material3.darkColorScheme 8 | import androidx.compose.material3.dynamicDarkColorScheme 9 | import androidx.compose.material3.dynamicLightColorScheme 10 | import androidx.compose.material3.lightColorScheme 11 | import androidx.compose.runtime.Composable 12 | import androidx.compose.runtime.SideEffect 13 | import androidx.compose.ui.graphics.toArgb 14 | import androidx.compose.ui.platform.LocalContext 15 | import androidx.compose.ui.platform.LocalView 16 | import androidx.core.view.ViewCompat 17 | 18 | private val DarkColorScheme = darkColorScheme( 19 | primary = Purple80, 20 | secondary = PurpleGrey80, 21 | tertiary = Pink80 22 | ) 23 | 24 | private val LightColorScheme = lightColorScheme( 25 | primary = Purple40, 26 | secondary = PurpleGrey40, 27 | tertiary = Pink40 28 | 29 | /* Other default colors to override 30 | background = Color(0xFFFFFBFE), 31 | surface = Color(0xFFFFFBFE), 32 | onPrimary = Color.White, 33 | onSecondary = Color.White, 34 | onTertiary = Color.White, 35 | onBackground = Color(0xFF1C1B1F), 36 | onSurface = Color(0xFF1C1B1F), 37 | */ 38 | ) 39 | 40 | @Composable 41 | fun JetPackComposeBasicTheme( 42 | darkTheme: Boolean = isSystemInDarkTheme(), 43 | // Dynamic color is available on Android 12+ 44 | dynamicColor: Boolean = true, 45 | content: @Composable () -> Unit 46 | ) { 47 | val colorScheme = when { 48 | dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> { 49 | val context = LocalContext.current 50 | if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context) 51 | } 52 | darkTheme -> DarkColorScheme 53 | else -> LightColorScheme 54 | } 55 | val view = LocalView.current 56 | if (!view.isInEditMode) { 57 | SideEffect { 58 | (view.context as Activity).window.statusBarColor = colorScheme.primary.toArgb() 59 | ViewCompat.getWindowInsetsController(view)?.isAppearanceLightStatusBars = darkTheme 60 | } 61 | } 62 | 63 | MaterialTheme( 64 | colorScheme = colorScheme, 65 | typography = Typography, 66 | content = content 67 | ) 68 | } -------------------------------------------------------------------------------- /app/src/main/java/com/lahsuak/apps/jetpackcomposebasic/ui/theme/Type.kt: -------------------------------------------------------------------------------- 1 | package com.lahsuak.apps.jetpackcomposebasic.ui.theme 2 | 3 | import androidx.compose.material3.Typography 4 | import androidx.compose.ui.text.TextStyle 5 | import androidx.compose.ui.text.font.FontFamily 6 | import androidx.compose.ui.text.font.FontWeight 7 | import androidx.compose.ui.unit.sp 8 | 9 | // Set of Material typography styles to start with 10 | val Typography = Typography( 11 | bodyLarge = TextStyle( 12 | fontFamily = FontFamily.Default, 13 | fontWeight = FontWeight.Normal, 14 | fontSize = 16.sp, 15 | lineHeight = 24.sp, 16 | letterSpacing = 0.5.sp 17 | ) 18 | /* Other default text styles to override 19 | titleLarge = TextStyle( 20 | fontFamily = FontFamily.Default, 21 | fontWeight = FontWeight.Normal, 22 | fontSize = 22.sp, 23 | lineHeight = 28.sp, 24 | letterSpacing = 0.sp 25 | ), 26 | labelSmall = TextStyle( 27 | fontFamily = FontFamily.Default, 28 | fontWeight = FontWeight.Medium, 29 | fontSize = 11.sp, 30 | lineHeight = 16.sp, 31 | letterSpacing = 0.5.sp 32 | ) 33 | */ 34 | ) -------------------------------------------------------------------------------- /app/src/main/res/drawable-v24/ic_launcher_foreground.xml: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | 15 | 18 | 21 | 22 | 23 | 24 | 30 | -------------------------------------------------------------------------------- /app/src/main/res/drawable/ic_launcher_background.xml: -------------------------------------------------------------------------------- 1 | 2 | 7 | 10 | 15 | 20 | 25 | 30 | 35 | 40 | 45 | 50 | 55 | 60 | 65 | 70 | 75 | 80 | 85 | 90 | 95 | 100 | 105 | 110 | 115 | 120 | 125 | 130 | 135 | 140 | 145 | 150 | 155 | 160 | 165 | 170 | 171 | -------------------------------------------------------------------------------- /app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /app/src/main/res/mipmap-hdpi/ic_launcher.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-hdpi/ic_launcher.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-hdpi/ic_launcher_round.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-hdpi/ic_launcher_round.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-mdpi/ic_launcher.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-mdpi/ic_launcher.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-mdpi/ic_launcher_round.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-mdpi/ic_launcher_round.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xhdpi/ic_launcher.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xhdpi/ic_launcher.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xhdpi/ic_launcher_round.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xhdpi/ic_launcher_round.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xxhdpi/ic_launcher.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xxhdpi/ic_launcher.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xxxhdpi/ic_launcher.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xxxhdpi/ic_launcher.webp -------------------------------------------------------------------------------- /app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KaushalVasava/JetPackCompose_Basic/792cab69cbcdae5c734a5ad30853408bd9188290/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp -------------------------------------------------------------------------------- /app/src/main/res/values/colors.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | #FFBB86FC 4 | #FF6200EE 5 | #FF3700B3 6 | #FF03DAC5 7 | #FF018786 8 | #FF000000 9 | #FFFFFFFF 10 | -------------------------------------------------------------------------------- /app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | JetPackCompose Basic 3 | -------------------------------------------------------------------------------- /app/src/main/res/values/themes.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 |