To Announcements

IT 372 -- Jetpack Compose Examples

Table of Contents for Examples

• TextWithTitle  DisplayImage  DisplayImage  ClickMe  ClickCounter2
  TempConv6  InToCm   ScrollableColumn   LazyColumn   TestCheckboxSwitch1
  TestCheckboxSwitch2   TestRadio1   TestRadio2   TestSlider   TestToast
  TheRaven   ShowSuit   GroceryItemsList   GroceryItemsMap   RandomAnimals
  WriteToFile   GroceryItemsFromFile   GroceryItemsToFile   LineCircleRect
  GridOfLines  SpokesInCircle   Rainbow   CirclesFromFile   RandomCircles
  TouchPoint   FormatGroceryItemsList   BreakfastBeverage   Proj4Exa
  Proj4Exb   TestTheme  

Jetpack Compose Examples

1. TextWithTitle Example -- Display text with title at the top of display.
         MainActivity.kt
2. DisplayImage Example -- Display title and image.
         MainActivity.kt   andromeda.jpg
3. ClickMe Example -- Change the text of the button when it is clicked.
         MainActivity.kt
4. ClickCounter2 Example -- Change the text of the button when it is clicked.
         MainActivity.kt
5. ClickableText Example -- Change the text in a Text element when it is clicked.
         MainActivity.kt
6. TempConv6 Example -- Enter a Celsius text value in the TextField element and convert it to Fahrenheit when the button is clicked. This is the example from the Intro to JetPackCompose document.
         MainActivity.kt
7. InToCm Example -- Input a length in inches value in the TextField then output the length in centimeters whenever the textfield value changes.
         MainActivity.kt
8. ScrollableColumn Example -- Display numbers 1 to 20 in a Column that is set to scrollable.
         MainActivity.kt
9. LazyColumn Example -- Display numbers 1 to 20 in a LazyColumn. A Column renders all items, even the ones not in the viewport, whereas a LazyColumn only renders items in the viewport for better performance. A LazyColumn is scrollable by default.
         MainActivity.kt
10. TestCheckboxSwitch1 Example -- Display the states of the checkbox and switch in the Text element when the button is clicked.
          MainActivity.kt
11. TestCheckboxSwitch2 Example -- Display the current states of the checkbox and switch in the Text element when the states change.
          MainActivity.kt
12. TestRadioButton1 Example -- Display the currently checked radio button when the button is clicked.
          MainActivity.kt
13. TestRadioButton2 Example -- Display the currently checked radio button after an unchecked radio button is checked.
          MainActivity.kt
14. TestSlider Example -- Display the slider value in a Text element as the slider thumb is moved.
          MainActivity.kt
15. TestSlider Example -- Display the slider value in a Text element as the slider thumb is moved.
          MainActivity.kt
16. TestToast Example -- Display a Toast when the button is clicked.
          MainActivity.kt
17. TheRaven Example -- Display the Edgar Allan Poe poem The Raven in a scrollable column. Create a new directory named raw in the res folder, then copy theraven.txt file into that directory.
          MainActivity.kt   theraven.txt
18. ShowSuit Example -- Display one of the card suits spades, hearts, diamonds, or clubs when the corresponding radio button is clicked.
          MainActivity.kt   spade.png   heart.png   diamond.png   club.png
19. GroceryItemsList Example -- Display the GroceryItem objects stored in a MutableList in a scrollable column. GroceryItem is a data class.
          MainActivity.kt   GroceryItem.kt
20. GroceryItemsMap Example -- Display the GroceryItem object stored in a Map whose key is entered in a TextField. GroceryItem is a data class. Use the data class generated toString method to output the information.
          MainActivity.kt   GroceryItem.kt
21. RandomAnimals Example -- Display a random animal and image file name stored in a MutableMap whose key is entered in a TextField. GroceryItem is a data class. For Project 3c, you actually display the image, not just ite file name.
          MainActivity.kt   animals.txt
22. WriteToFile Example -- Write to, read from, and delete a file named demofile.txt in internal storage.
          MainActivity.kt
23. GroceryItemsFromFile Example -- Display GroceryItem objects stored into a MutableList.  GroceryItem is a data class. The list is loaded from a file stored in the raw folder.
          MainActivity.kt   groc.txt
24. GroceryItemsToFile Example -- Enter strings in a textfield. When the Store button is clicked, store the data in an internal file stored on the device or emulator. When the display button is clicked, show the data in a Text element.
          MainActivity.kt   GroceryItem.kt
25. LineCircleRect Example -- Draw a line, circle, and rectangle in a canvas using drawing functions.
          MainActivity.kt
26. GridOfLines Example -- Draw horizontal and vertical lines in a canvas to form a grid.
          MainActivity.kt
27. SpokesInCircle Example -- Draw a circle with lines from its center to perimeter to form spokes.
          MainActivity.kt
28. Rainbow Example -- Draw colored rectangles to form a straight line rainbow.
          MainActivity.kt
29. CirclesFromFile Example -- Draw circles in a canvas from data in the file res/raw/circles.txt.
    Each file row contains these comma delimted fields: x and y of center, radius, color, where 0=red, 1=yellow, 2=green, 3=cyan, 4=blue, 5=magenta.
          MainActivity.kt   circles.txt
30. RandomCircles Example -- Draw 100 random circles filled with 7 different colors.<br>
          MainActivity.kt
31. TouchPoint Example -- Draw a circle when a user touches (clicks) on the Canvas element.
          MainActivity.kt
32. FormatGroceryItemsList Example -- Format grocery items in three ways: A. Load into a MutableList collection from field values read from TextField elements, B. Format data to display in a Text element, C: Load into MutableList from string read from file.
    Run this example on the Kotlin Playground website: http://play.kotlinlang.org
    Before running, place this example code in a main method and comment out or remove all sample output.
    Example source code: use-list.kt
33. FormatGroceryItemsMap Example -- Format grocery items in three ways: A. Load into a MutableMap collection from field values read from TextField elements, B. Format data to display in a Text element, C: Load into MutableMap from string read from file.
    Run this example on the Kotlin Playground website: http://play.kotlinlang.org
    Before running, place this example code in a main method and comment out or remove all sample output.
    Example code: use-map.kt
34. BreakfastBeverage Example -- Order your breakfast beverage with this app.
          MainActivity.kt
35. Proj4Exa Example -- Load GroceryItem array from strings.xml resource file, display the items in a Text element, and save the items as a string in an internal file of the emulator.
          MainActivity.kt   strings.xml
36. Proj4Exb Example -- Enter, display, and clear grocery items. A grocery item is stored like this:
    Bananas;35456;2.75
          MainActivity.kt
37. TestTheme Example -- after replacing MainActivity.kt with the file for this example, run the app. Then, in Settings, change from Light Theme to Dark Theme and run the app again. To change the light theme,  go to Settings >> Display & touch. Use the switch to change between Light Theme and Dark Theme.
          MainActivity.kt
    
    Then find and view these files:

    res/values/themes.xml
    kotlin+java/it372.ssmith.testtheme/ui.theme/Color.kt
    kotlin+java/it372.ssmith.testtheme/ui.theme/Theme.kt
    kotlin+java/it372.ssmith.testtheme/ui.theme/Type.kt
    

    Use the package name for your project.