Android Learn and Inspire Series - Coffee & Compose [Session 1]

Slides from Coffee & Compose session

Transcript

1. Coffee & Compose ________
2. About Us Hemanshu Varma Software Engineer - Recro Bharath Venkatesan Software Engineer - OpenBet
3. TOPIC Kotlin Basics What is Compose? Compose over XML Live Coding What’s Next? QnA Today’s Agenda
4. Kotlin Programming Language Kotlin helps developers write concise yet NULL safe code. Kotlin first approach recommended by Google
5. Kotlin Playground Write and run Kotlin code on the fly within browser
6. Functions A function is a segment of a program that performs a specific task. You can have many functions in your program or only a single one.
7. Defining a function Functions begin with the fun keyword. fun displayIntroduction() { }
8. Defining a function Functions have a name so that they can be called. fun displayIntroduction() { }
9. Defining a function Functions need a set of parentheses after the function name in order to surround the function inputs. fun displayIntroduction() { }
10. Defining a function The curly braces make up the function body and contain the instructions needed to execute a task. fun displayIntroduction() { }
11. Putting it together fun displayIntroduction() { // We will fill this out! } Output: Hi I’m Meghan and I am 28 years old
12. A container for a single piece of data. Variables
13. My name is and I am years old Variables name age
14. val keyword Use when you expect the variable value will not change. Example: name var keyword Use when you expect the variable value can change. Example: age Defining a variable
15. Defining a variable Variables start with a var or val keyword. fun displayIntroduction() { val name: String = "Meghan" var age: Int = 28 }
16. Defining a variable All variables must have a name. fun displayIntroduction() { val name: String = "Meghan" var age: Int = 28 }
17. Defining a variable Data type is the type of data that the variable holds. fun displayIntroduction() { val name: String = "Meghan" var age: Int = 28 }
18. Defining a variable The initial value is the value that is stored in the variable. fun displayIntroduction() { val name: String = "Meghan" var age: Int = 28 }
19. Putting it together fun displayIntroduction() { val name = "Meghan" val age = 28 println("Hi I'm $name and I am $age years old") }
20. Putting it together fun main() { displayIntroduction() } fun displayIntroduction() { val name = "Meghan" val age = 28 println("Hi I'm $name and I am $age years old") } Output: Hi I’m Meghan and I am 28 years old
21. What is Compose?
22. Jetpack Compose is the modern toolkit for building native user interfaces for Android apps. Compose apps are written in the Kotlin programming language. Compose makes it easier and faster to build UIs on Android. Jetpack Compose
23. Benefits of using Jetpack Compose Less code Do more with less code and avoid entire classes of bugs. Code is simpler and easier to maintain. Intuitive Just describe your UI, and Compose takes care of the rest. As app state changes, your UI automatically updates. Accelerates Development Compatible with all your existing code so you can adopt when and where you want. Iterate fast with live previews and full Android Studio support. Powerful Create beautiful apps with direct access to the Android platform APIs and built-in support for Material Design, Dark theme, animations, and more.
24. Compose over XML
25. ACTIVITY XML Imperative Approach
26. ACTIVITY Declarative Approach Compose Compose ……..
27. Animations https://developer.android.com/jetpack/compose/animation
28. Why is it called Compose?
29. Old Android UI System Inheritance View EditText TextView
30. Composable Compose UI System Composition Composable Composable Composable Composable Composable
31. What we will build today? About Me App
32. Lets code... Grab your coffee
33. What’s Next?
34. Pathways Each track offers learning content from Google that is structured into pathways. A pathway consists of a sequence of learning activities (videos, articles, and codelabs), to help you learn about a certain technical topic. There is a quiz at the end of a pathway to test what you learned.
35. Earn digital badges For each quiz successfully passed, participants earn a badge on their developer profiles Carrie Sawyer
36. Android Basics with Compose Course g.co/android/basics-compose
37. 2 3 1 Introduction to Kotlin Set up Android Studio Build a basic layout (4 hours) (3 hours) (4 hours) Learn introductory programming concepts in Kotlin to prepare for building Android apps in Kotlin. Install and set up Android Studio, create your first project, and run it on a device or emulator. Learn the basics of layouts in Android by creating your very own birthday card app! this is where you will truly start learning Compose! Android Basics with Compose Course Unit 1
38. Customize for your audience No programming experience Go through each pathway of each unit in order, since the concepts build on each other. Already have programming experience Skip the pathways focused on Kotlin concepts that don’t contain Android, which are the first pathway of each unit from Units 1 to 3. Work through the remaining pathways in each unit in order to learn Android concepts. Quick Tip: If a developer is new to Kotlin, they can do Kotlin Koans online exercises as a quick jumpstart to become familiar with Kotlin syntax & idioms (~ 5 hours).
39. Additional resources Practice problems These appear throughout the Android Basics with Compose course for learners to apply what they just learned in the context of a new app. These practice problems are optional. Learners can start on them if they finish early at a session, or do them at home. Open-ended projects At the end of each unit, there are opportunities for learners to create their own app, with some guidelines to help them. Since these apps will be unique to each individual, the apps could be added to their portfolio of work, and even uploaded to GitHub. Unit 1 - Business Card app Unit 2 - Art Space app Unit 3 - 30 Days app
40. Additional resources (Experienced Track) Jetpack Compose for Android Developers Course (link here) Compose Presentation Decks (link here) Existing presentation decks with speaker notes are available on different Compose topic areas. You can use these to deliver talks or supplement content for your sessions. Make sure to check out Jetpack compose from official android developers page (Jetpack Compose)
41. Questions?
42. Follow Us hemanshuvarma bharathvenkatesan @varmahemanshu @im_bharath_97
43. Share what you’ve learned using .#AndroidEducators on social media
44. Thank You and All the Best!