Added top bar
This commit is contained in:
Fabio
parent
4d25cd1329
commit
ac3ee9abbd
@ -3,18 +3,29 @@ package com.f1rq.lifemap
|
|||||||
import android.os.Bundle
|
import android.os.Bundle
|
||||||
import androidx.activity.ComponentActivity
|
import androidx.activity.ComponentActivity
|
||||||
import androidx.activity.compose.setContent
|
import androidx.activity.compose.setContent
|
||||||
|
import androidx.compose.foundation.layout.Box
|
||||||
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
|
import androidx.compose.foundation.layout.wrapContentHeight
|
||||||
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.material3.Scaffold
|
import androidx.compose.material3.Scaffold
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
|
import androidx.compose.ui.draw.clip
|
||||||
|
import androidx.compose.ui.draw.shadow
|
||||||
import androidx.compose.ui.tooling.preview.Preview
|
import androidx.compose.ui.tooling.preview.Preview
|
||||||
|
import androidx.compose.ui.unit.dp
|
||||||
import androidx.navigation.compose.NavHost
|
import androidx.navigation.compose.NavHost
|
||||||
import androidx.navigation.compose.composable
|
import androidx.navigation.compose.composable
|
||||||
import androidx.navigation.compose.currentBackStackEntryAsState
|
import androidx.navigation.compose.currentBackStackEntryAsState
|
||||||
import androidx.navigation.compose.rememberNavController
|
import androidx.navigation.compose.rememberNavController
|
||||||
import com.f1rq.lifemap.navigationbar.NavigationBar
|
import com.f1rq.lifemap.navigationbar.NavigationBar
|
||||||
|
import com.f1rq.lifemap.topappbar.TopAppBar
|
||||||
import com.f1rq.lifemap.screens.ListView
|
import com.f1rq.lifemap.screens.ListView
|
||||||
import com.f1rq.lifemap.screens.MapView
|
import com.f1rq.lifemap.screens.MapView
|
||||||
|
import com.f1rq.lifemap.screens.SettingsScreen
|
||||||
|
import com.f1rq.lifemap.screens.NotificationsScreen
|
||||||
import com.f1rq.lifemap.ui.theme.LifeMapTheme
|
import com.f1rq.lifemap.ui.theme.LifeMapTheme
|
||||||
import com.f1rq.lifemap.ui.theme.ActiveNavColor
|
import com.f1rq.lifemap.ui.theme.ActiveNavColor
|
||||||
import com.f1rq.lifemap.ui.theme.InactiveNavColor
|
import com.f1rq.lifemap.ui.theme.InactiveNavColor
|
||||||
@ -27,6 +38,12 @@ class MainActivity : ComponentActivity() {
|
|||||||
val navController = rememberNavController()
|
val navController = rememberNavController()
|
||||||
|
|
||||||
Scaffold(
|
Scaffold(
|
||||||
|
topBar = {
|
||||||
|
TopAppBar(
|
||||||
|
onSettingsIconTapped = { navController.navigate("settings")},
|
||||||
|
onNotificationsIconTapped = { navController.navigate("notifications")}
|
||||||
|
)
|
||||||
|
},
|
||||||
bottomBar = {
|
bottomBar = {
|
||||||
val navBackStackEntry = navController.currentBackStackEntryAsState()
|
val navBackStackEntry = navController.currentBackStackEntryAsState()
|
||||||
val currentRoute = navBackStackEntry.value?.destination?.route
|
val currentRoute = navBackStackEntry.value?.destination?.route
|
||||||
@ -46,6 +63,8 @@ class MainActivity : ComponentActivity() {
|
|||||||
) {
|
) {
|
||||||
composable("mapview") { MapView(Modifier) }
|
composable("mapview") { MapView(Modifier) }
|
||||||
composable("listview") { ListView(Modifier) }
|
composable("listview") { ListView(Modifier) }
|
||||||
|
composable("settings") { SettingsScreen(Modifier)}
|
||||||
|
composable("notifications") { NotificationsScreen(Modifier)}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -6,6 +6,7 @@ import androidx.compose.material3.Text
|
|||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.Alignment
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
|
import com.f1rq.lifemap.addevent.AddEvent
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun MapView(modifier: Modifier = Modifier) {
|
fun MapView(modifier: Modifier = Modifier) {
|
||||||
@ -13,6 +14,7 @@ fun MapView(modifier: Modifier = Modifier) {
|
|||||||
modifier = Modifier.fillMaxSize(),
|
modifier = Modifier.fillMaxSize(),
|
||||||
contentAlignment = Alignment.Center
|
contentAlignment = Alignment.Center
|
||||||
) {
|
) {
|
||||||
|
AddEvent()
|
||||||
Text("Map view")
|
Text("Map view")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
package com.f1rq.lifemap.screens
|
||||||
|
|
||||||
|
import androidx.compose.foundation.layout.Box
|
||||||
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
|
import androidx.compose.material3.Text
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.Alignment
|
||||||
|
import androidx.compose.ui.Modifier
|
||||||
|
|
||||||
|
@Composable
|
||||||
|
fun NotificationsScreen(modifier: Modifier = Modifier) {
|
||||||
|
Box(
|
||||||
|
modifier = Modifier.fillMaxSize(),
|
||||||
|
contentAlignment = Alignment.Center
|
||||||
|
) {
|
||||||
|
Text("Notifications")
|
||||||
|
}
|
||||||
|
}
|
||||||
18
app/src/main/java/com/f1rq/lifemap/screens/SettingsScreen.kt
Normal file
18
app/src/main/java/com/f1rq/lifemap/screens/SettingsScreen.kt
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
package com.f1rq.lifemap.screens
|
||||||
|
|
||||||
|
import androidx.compose.foundation.layout.Box
|
||||||
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
|
import androidx.compose.material3.Text
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.Alignment
|
||||||
|
import androidx.compose.ui.Modifier
|
||||||
|
|
||||||
|
@Composable
|
||||||
|
fun SettingsScreen(modifier: Modifier = Modifier) {
|
||||||
|
Box(
|
||||||
|
modifier = Modifier.fillMaxSize(),
|
||||||
|
contentAlignment = Alignment.Center
|
||||||
|
) {
|
||||||
|
Text("Settings screen")
|
||||||
|
}
|
||||||
|
}
|
||||||
1
app/src/main/ui-packages/add_event/VERSION.txt
Normal file
1
app/src/main/ui-packages/add_event/VERSION.txt
Normal file
@ -0,0 +1 @@
|
|||||||
|
0.3.12
|
||||||
360
app/src/main/ui-packages/add_event/add_event.json
Normal file
360
app/src/main/ui-packages/add_event/add_event.json
Normal file
@ -0,0 +1,360 @@
|
|||||||
|
{
|
||||||
|
"name": "add_event",
|
||||||
|
"version": 33,
|
||||||
|
"source-key": {
|
||||||
|
"type": "figma",
|
||||||
|
"file": "7RzB5mC9Qj82hGEbAM11GM",
|
||||||
|
"node": "76:4",
|
||||||
|
"version": "2205685389783780702",
|
||||||
|
"component-id": "7df95c19403de2b4b8280d6464fc1c747d4921a5"
|
||||||
|
},
|
||||||
|
"default": "Add event",
|
||||||
|
"design": {
|
||||||
|
"atoms": [
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "top_level",
|
||||||
|
"root": "true"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "top_level_synth"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Background"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Content"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Title"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "FAB"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"id": "LifeMap title"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"id": "subtitle"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "state-layer"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "vector",
|
||||||
|
"id": "icon1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "layer"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"modes": {
|
||||||
|
"Add event": {
|
||||||
|
"rules": [
|
||||||
|
{
|
||||||
|
"id": "top_level",
|
||||||
|
"is-structured": false,
|
||||||
|
"children": [
|
||||||
|
"top_level_synth",
|
||||||
|
"Background"
|
||||||
|
],
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "top_level_synth",
|
||||||
|
"opacity": 100.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"main-axis-align": "start",
|
||||||
|
"cross-axis-align": "start",
|
||||||
|
"children": [
|
||||||
|
"Content"
|
||||||
|
],
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Background",
|
||||||
|
"border-radius": 12.0,
|
||||||
|
"stroke-width": 1.0,
|
||||||
|
"stroke-color": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 269.99999999999994,
|
||||||
|
"saturation": 0.057692307692307626,
|
||||||
|
"value": 0.8156862745098039
|
||||||
|
},
|
||||||
|
"is-structured": false,
|
||||||
|
"children": [
|
||||||
|
"layer"
|
||||||
|
],
|
||||||
|
"background-color": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 0.0,
|
||||||
|
"saturation": 0.0,
|
||||||
|
"value": 0.9215686274509803
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Content",
|
||||||
|
"padding": 20.0,
|
||||||
|
"border-radius": 12.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 375.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 82.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"main-axis-align": "space-between",
|
||||||
|
"children": [
|
||||||
|
"Title",
|
||||||
|
"FAB"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Title",
|
||||||
|
"padding": {
|
||||||
|
"top": 5.0
|
||||||
|
},
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 156.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 48.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"cross-axis-align": "start",
|
||||||
|
"children": [
|
||||||
|
"LifeMap title",
|
||||||
|
"subtitle"
|
||||||
|
],
|
||||||
|
"item-spacing": -1.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "FAB",
|
||||||
|
"border-radius": 16.0,
|
||||||
|
"drop-shadow": {
|
||||||
|
"color": {
|
||||||
|
"alpha": 0.2980392156862745,
|
||||||
|
"hue": 0.0,
|
||||||
|
"saturation": 0.0,
|
||||||
|
"value": 0.0
|
||||||
|
},
|
||||||
|
"blur": 3.0,
|
||||||
|
"offset-x": 0.0,
|
||||||
|
"offset-y": 1.0,
|
||||||
|
"spread": 0.0,
|
||||||
|
"blend-mode": "normal"
|
||||||
|
},
|
||||||
|
"tap-handler": "$on add button tapped",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"state-layer"
|
||||||
|
],
|
||||||
|
"background-color": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 0.0,
|
||||||
|
"saturation": 0.0,
|
||||||
|
"value": 0.9215686274509803
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "LifeMap title",
|
||||||
|
"font-weight": "^md.sys.typescale.title-large.weight",
|
||||||
|
"color": "^md.sys.color.on-surface",
|
||||||
|
"text-content": "Add event",
|
||||||
|
"overflow": "visible",
|
||||||
|
"text-align": "left",
|
||||||
|
"text-size": "^md.sys.typescale.title-large.size",
|
||||||
|
"letter-spacing": "^md.sys.typescale.title-large.tracking",
|
||||||
|
"line-height": "^md.sys.typescale.title-large.line-height",
|
||||||
|
"typeface": "^md.sys.typescale.title-large.font"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "subtitle",
|
||||||
|
"font-weight": "^md.sys.typescale.label-medium.weight",
|
||||||
|
"color": "^md.sys.color.on-surface",
|
||||||
|
"text-content": "With localization, date etc.",
|
||||||
|
"overflow": "visible",
|
||||||
|
"text-align": "left",
|
||||||
|
"text-size": "^md.sys.typescale.label-medium.size",
|
||||||
|
"letter-spacing": "^md.sys.typescale.label-medium.tracking",
|
||||||
|
"line-height": "^md.sys.typescale.label-medium.line-height",
|
||||||
|
"typeface": "^md.sys.typescale.label-medium.font"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "state-layer",
|
||||||
|
"padding": 16.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"icon"
|
||||||
|
],
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "icon",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-structured": false,
|
||||||
|
"children": [
|
||||||
|
"icon1"
|
||||||
|
],
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "icon1",
|
||||||
|
"margin": 3.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"vector-content": "icon.svg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "layer",
|
||||||
|
"padding": 10.0,
|
||||||
|
"item-spacing": 10.0,
|
||||||
|
"clip-content": false
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"parameters": {
|
||||||
|
"on add button tapped": {
|
||||||
|
"data-type": "void-callback",
|
||||||
|
"required": false,
|
||||||
|
"description": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"ambients": {
|
||||||
|
"md.sys.color.on-surface": {
|
||||||
|
"data-type": "color",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.font": {
|
||||||
|
"data-type": "typeface",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.weight": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.size": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.tracking": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.line-height": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.font": {
|
||||||
|
"data-type": "typeface",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.weight": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.size": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.tracking": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.line-height": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"previews": [
|
||||||
|
{
|
||||||
|
"design": "Add event",
|
||||||
|
"size": {
|
||||||
|
"width": 375.0,
|
||||||
|
"height": 82.0
|
||||||
|
},
|
||||||
|
"ambients": {
|
||||||
|
"md.sys.color.on-surface": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 264.0,
|
||||||
|
"saturation": 0.15625,
|
||||||
|
"value": 0.12549019607843137
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.weight": 400.0,
|
||||||
|
"md.sys.typescale.title-large.size": 22.0,
|
||||||
|
"md.sys.typescale.title-large.line-height": 1.272727279663086,
|
||||||
|
"md.sys.typescale.label-medium.weight": 500.0,
|
||||||
|
"md.sys.typescale.label-medium.size": 12.0,
|
||||||
|
"md.sys.typescale.label-medium.tracking": 0.5,
|
||||||
|
"md.sys.typescale.label-medium.line-height": 1.3333332824707032
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"adin-component-search-paths": [],
|
||||||
|
"image-search-paths": [],
|
||||||
|
"vector-search-paths": []
|
||||||
|
}
|
||||||
BIN
app/src/main/ui-packages/add_event/add_event_preview.png
Normal file
BIN
app/src/main/ui-packages/add_event/add_event_preview.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
4
app/src/main/ui-packages/add_event/config.json
Normal file
4
app/src/main/ui-packages/add_event/config.json
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"preview-theme": "androidx.compose.material3.MaterialTheme",
|
||||||
|
"ambient-translations-path": "app/src/main/ui-package-resources/style-mappings/m3_design_kit.json"
|
||||||
|
}
|
||||||
3
app/src/main/ui-packages/add_event/icon.svg
Normal file
3
app/src/main/ui-packages/add_event/icon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M2 16H3.425L13.2 6.225L11.775 4.8L2 14.575V16ZM0 18V13.75L13.2 0.575C13.4 0.391667 13.6208 0.25 13.8625 0.15C14.1042 0.05 14.3583 0 14.625 0C14.8917 0 15.15 0.05 15.4 0.15C15.65 0.25 15.8667 0.4 16.05 0.6L17.425 2C17.625 2.18333 17.7708 2.4 17.8625 2.65C17.9542 2.9 18 3.15 18 3.4C18 3.66667 17.9542 3.92083 17.8625 4.1625C17.7708 4.40417 17.625 4.625 17.425 4.825L4.25 18H0ZM12.475 5.525L11.775 4.8L13.2 6.225L12.475 5.525Z" fill="#49454F"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 555 B |
@ -5,7 +5,7 @@
|
|||||||
"type": "figma",
|
"type": "figma",
|
||||||
"file": "7RzB5mC9Qj82hGEbAM11GM",
|
"file": "7RzB5mC9Qj82hGEbAM11GM",
|
||||||
"node": "38:3",
|
"node": "38:3",
|
||||||
"version": "2205486309991144776",
|
"version": "2205685389783780702",
|
||||||
"component-id": "915162a5cdf4f7f91ace42d239b4d1faf0d5c6e7"
|
"component-id": "915162a5cdf4f7f91ace42d239b4d1faf0d5c6e7"
|
||||||
},
|
},
|
||||||
"default": "Navigation bar",
|
"default": "Navigation bar",
|
||||||
|
|||||||
1
app/src/main/ui-packages/top_app_bar/FONTS.txt
Normal file
1
app/src/main/ui-packages/top_app_bar/FONTS.txt
Normal file
@ -0,0 +1 @@
|
|||||||
|
Roboto
|
||||||
1
app/src/main/ui-packages/top_app_bar/VERSION.txt
Normal file
1
app/src/main/ui-packages/top_app_bar/VERSION.txt
Normal file
@ -0,0 +1 @@
|
|||||||
|
0.3.12
|
||||||
4
app/src/main/ui-packages/top_app_bar/config.json
Normal file
4
app/src/main/ui-packages/top_app_bar/config.json
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"preview-theme": "androidx.compose.material3.MaterialTheme",
|
||||||
|
"ambient-translations-path": "app/src/main/ui-package-resources/style-mappings/m3_design_kit.json"
|
||||||
|
}
|
||||||
3
app/src/main/ui-packages/top_app_bar/icon.svg
Normal file
3
app/src/main/ui-packages/top_app_bar/icon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="16" height="20" viewBox="0 0 16 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M0 17V15H2V8C2 6.61667 2.41667 5.39167 3.25 4.325C4.08333 3.24167 5.16667 2.53333 6.5 2.2V1.5C6.5 1.08333 6.64167 0.733333 6.925 0.449999C7.225 0.15 7.58333 0 8 0C8.41667 0 8.76667 0.15 9.05 0.449999C9.35 0.733333 9.5 1.08333 9.5 1.5V2.2C10.8333 2.53333 11.9167 3.24167 12.75 4.325C13.5833 5.39167 14 6.61667 14 8V15H16V17H0ZM8 20C7.45 20 6.975 19.8083 6.575 19.425C6.19167 19.025 6 18.55 6 18H10C10 18.55 9.8 19.025 9.4 19.425C9.01667 19.8083 8.55 20 8 20ZM4 15H12V8C12 6.9 11.6083 5.95833 10.825 5.175C10.0417 4.39167 9.1 4 8 4C6.9 4 5.95833 4.39167 5.175 5.175C4.39167 5.95833 4 6.9 4 8V15Z" fill="#49454F"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 724 B |
3
app/src/main/ui-packages/top_app_bar/icon1.svg
Normal file
3
app/src/main/ui-packages/top_app_bar/icon1.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M9.72933 6C10.7902 6 11.8076 6.42143 12.5578 7.17157C13.3079 7.92172 13.7293 8.93913 13.7293 10C13.7293 11.0609 13.3079 12.0783 12.5578 12.8284C11.8076 13.5786 10.7902 14 9.72933 14C8.66847 14 7.65105 13.5786 6.9009 12.8284C6.15076 12.0783 5.72933 11.0609 5.72933 10C5.72933 8.93913 6.15076 7.92172 6.9009 7.17157C7.65105 6.42143 8.66847 6 9.72933 6ZM9.72933 8C9.1989 8 8.69019 8.21071 8.31512 8.58579C7.94005 8.96086 7.72933 9.46957 7.72933 10C7.72933 10.5304 7.94005 11.0391 8.31512 11.4142C8.69019 11.7893 9.1989 12 9.72933 12C10.2598 12 10.7685 11.7893 11.1435 11.4142C11.5186 11.0391 11.7293 10.5304 11.7293 10C11.7293 9.46957 11.5186 8.96086 11.1435 8.58579C10.7685 8.21071 10.2598 8 9.72933 8ZM7.72933 20C7.47933 20 7.26933 19.82 7.22933 19.58L6.85933 16.93C6.22933 16.68 5.68933 16.34 5.16933 15.94L2.67933 16.95C2.45933 17.03 2.18933 16.95 2.06933 16.73L0.0693316 13.27C-0.0606684 13.05 -0.000668302 12.78 0.189332 12.63L2.29933 10.97L2.22933 10L2.29933 9L0.189332 7.37C-0.000668302 7.22 -0.0606684 6.95 0.0693316 6.73L2.06933 3.27C2.18933 3.05 2.45933 2.96 2.67933 3.05L5.16933 4.05C5.68933 3.66 6.22933 3.32 6.85933 3.07L7.22933 0.42C7.26933 0.18 7.47933 0 7.72933 0H11.7293C11.9793 0 12.1893 0.18 12.2293 0.42L12.5993 3.07C13.2293 3.32 13.7693 3.66 14.2893 4.05L16.7793 3.05C16.9993 2.96 17.2693 3.05 17.3893 3.27L19.3893 6.73C19.5193 6.95 19.4593 7.22 19.2693 7.37L17.1593 9L17.2293 10L17.1593 11L19.2693 12.63C19.4593 12.78 19.5193 13.05 19.3893 13.27L17.3893 16.73C17.2693 16.95 16.9993 17.04 16.7793 16.95L14.2893 15.95C13.7693 16.34 13.2293 16.68 12.5993 16.93L12.2293 19.58C12.1893 19.82 11.9793 20 11.7293 20H7.72933ZM8.97933 2L8.60933 4.61C7.40933 4.86 6.34933 5.5 5.57933 6.39L3.16933 5.35L2.41933 6.65L4.52933 8.2C4.12933 9.37 4.12933 10.64 4.52933 11.8L2.40933 13.36L3.15933 14.66L5.58933 13.62C6.35933 14.5 7.40933 15.14 8.59933 15.38L8.96933 18H10.4893L10.8593 15.39C12.0493 15.14 13.0993 14.5 13.8693 13.62L16.2993 14.66L17.0493 13.36L14.9293 11.81C15.3293 10.64 15.3293 9.37 14.9293 8.2L17.0393 6.65L16.2893 5.35L13.8793 6.39C13.1093 5.5 12.0493 4.86 10.8493 4.62L10.4793 2H8.97933Z" fill="#49454F"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.2 KiB |
457
app/src/main/ui-packages/top_app_bar/top_app_bar.json
Normal file
457
app/src/main/ui-packages/top_app_bar/top_app_bar.json
Normal file
@ -0,0 +1,457 @@
|
|||||||
|
{
|
||||||
|
"name": "top_app_bar",
|
||||||
|
"version": 33,
|
||||||
|
"source-key": {
|
||||||
|
"type": "figma",
|
||||||
|
"file": "7RzB5mC9Qj82hGEbAM11GM",
|
||||||
|
"node": "71:3",
|
||||||
|
"version": "2205685389783780702",
|
||||||
|
"component-id": "be1e47a9eb28efdd3c5b0590ec33e84c60626aa5"
|
||||||
|
},
|
||||||
|
"default": "Top app bar",
|
||||||
|
"design": {
|
||||||
|
"atoms": [
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "top_level",
|
||||||
|
"root": "true"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Title"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Buttons"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"id": "LifeMap title"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"id": "subtitle"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Notifications icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Settings icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "container"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "state-layer"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "vector",
|
||||||
|
"id": "icon"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "container1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "state-layer1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "group",
|
||||||
|
"id": "Icon1"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "vector",
|
||||||
|
"id": "icon1"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"modes": {
|
||||||
|
"Top app bar": {
|
||||||
|
"rules": [
|
||||||
|
{
|
||||||
|
"id": "top_level",
|
||||||
|
"padding": {
|
||||||
|
"left": 20.0,
|
||||||
|
"top": 55.0,
|
||||||
|
"right": 20.0,
|
||||||
|
"bottom": 20.0
|
||||||
|
},
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"stroke-alignment": "center",
|
||||||
|
"arrangement": "row",
|
||||||
|
"main-axis-align": "space-between",
|
||||||
|
"children": [
|
||||||
|
"Title",
|
||||||
|
"Buttons"
|
||||||
|
],
|
||||||
|
"background-color": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 0.0,
|
||||||
|
"saturation": 0.0,
|
||||||
|
"value": 0.9215686274509803
|
||||||
|
},
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Title",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"cross-axis-align": "start",
|
||||||
|
"children": [
|
||||||
|
"LifeMap title",
|
||||||
|
"subtitle"
|
||||||
|
],
|
||||||
|
"item-spacing": -1.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Buttons",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"main-axis-align": "start",
|
||||||
|
"children": [
|
||||||
|
"Notifications icon",
|
||||||
|
"Settings icon"
|
||||||
|
],
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "LifeMap title",
|
||||||
|
"font-weight": "^md.sys.typescale.title-large.weight",
|
||||||
|
"color": "^md.sys.color.on-surface",
|
||||||
|
"annotated-text-content": {
|
||||||
|
"text": "LifeMap",
|
||||||
|
"annotated-text-span-list": [
|
||||||
|
{
|
||||||
|
"span-start": 0,
|
||||||
|
"span-length": 7,
|
||||||
|
"annotated-text-style": {
|
||||||
|
"font-weight": 700.0,
|
||||||
|
"text-size": 22.0,
|
||||||
|
"letter-spacing": 0.0,
|
||||||
|
"line-height": 1.272727279663086,
|
||||||
|
"typeface": "Roboto"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"overflow": "visible",
|
||||||
|
"text-align": "left",
|
||||||
|
"text-size": "^md.sys.typescale.title-large.size",
|
||||||
|
"letter-spacing": "^md.sys.typescale.title-large.tracking",
|
||||||
|
"line-height": "^md.sys.typescale.title-large.line-height",
|
||||||
|
"typeface": "^md.sys.typescale.title-large.font"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "subtitle",
|
||||||
|
"font-weight": "^md.sys.typescale.label-medium.weight",
|
||||||
|
"color": "^md.sys.color.on-surface",
|
||||||
|
"text-content": "Personal life events",
|
||||||
|
"overflow": "visible",
|
||||||
|
"text-align": "left",
|
||||||
|
"text-size": "^md.sys.typescale.label-medium.size",
|
||||||
|
"letter-spacing": "^md.sys.typescale.label-medium.tracking",
|
||||||
|
"line-height": "^md.sys.typescale.label-medium.line-height",
|
||||||
|
"typeface": "^md.sys.typescale.label-medium.font"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Notifications icon",
|
||||||
|
"tap-handler": "$on notifications icon tapped",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 32.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 32.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
"container"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Settings icon",
|
||||||
|
"tap-handler": "$on settings icon tapped",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 32.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 32.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"children": [
|
||||||
|
"container1"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "container",
|
||||||
|
"border-radius": 100.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"state-layer"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "state-layer",
|
||||||
|
"padding": 8.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"Icon"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Icon",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-structured": false,
|
||||||
|
"children": [
|
||||||
|
"icon"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "icon",
|
||||||
|
"margin": {
|
||||||
|
"left": 4.0,
|
||||||
|
"top": 2.0,
|
||||||
|
"right": 4.0,
|
||||||
|
"bottom": 2.0
|
||||||
|
},
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"vector-content": "icon.svg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "container1",
|
||||||
|
"border-radius": 100.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"state-layer1"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "state-layer1",
|
||||||
|
"padding": 8.0,
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "shrink"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"arrangement": "row",
|
||||||
|
"children": [
|
||||||
|
"Icon1"
|
||||||
|
],
|
||||||
|
"item-spacing": 10.0,
|
||||||
|
"clip-content": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "Icon1",
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "fixed",
|
||||||
|
"value": 24.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-structured": false,
|
||||||
|
"children": [
|
||||||
|
"icon1"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": "icon1",
|
||||||
|
"margin": {
|
||||||
|
"left": 2.270660400390625,
|
||||||
|
"top": 2.0,
|
||||||
|
"right": 2.2706756591796875,
|
||||||
|
"bottom": 2.0
|
||||||
|
},
|
||||||
|
"size-constraints": {
|
||||||
|
"width-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
},
|
||||||
|
"height-constraints": {
|
||||||
|
"sizing-mode": "proportional",
|
||||||
|
"value": 1.0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"vector-content": "icon1.svg"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"parameters": {
|
||||||
|
"on notifications icon tapped": {
|
||||||
|
"data-type": "void-callback",
|
||||||
|
"required": false,
|
||||||
|
"description": ""
|
||||||
|
},
|
||||||
|
"on settings icon tapped": {
|
||||||
|
"data-type": "void-callback",
|
||||||
|
"required": false,
|
||||||
|
"description": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"ambients": {
|
||||||
|
"md.sys.color.on-surface": {
|
||||||
|
"data-type": "color",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.font": {
|
||||||
|
"data-type": "typeface",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.weight": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.size": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.tracking": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.line-height": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.font": {
|
||||||
|
"data-type": "typeface",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.weight": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.size": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.tracking": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
},
|
||||||
|
"md.sys.typescale.label-medium.line-height": {
|
||||||
|
"data-type": "double",
|
||||||
|
"description": null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"previews": [
|
||||||
|
{
|
||||||
|
"design": "Top app bar",
|
||||||
|
"size": {
|
||||||
|
"width": 375.0,
|
||||||
|
"height": 118.0
|
||||||
|
},
|
||||||
|
"ambients": {
|
||||||
|
"md.sys.color.on-surface": {
|
||||||
|
"alpha": 1.0,
|
||||||
|
"hue": 264.0,
|
||||||
|
"saturation": 0.15625,
|
||||||
|
"value": 0.12549019607843137
|
||||||
|
},
|
||||||
|
"md.sys.typescale.title-large.weight": 400.0,
|
||||||
|
"md.sys.typescale.title-large.size": 22.0,
|
||||||
|
"md.sys.typescale.title-large.line-height": 1.272727279663086,
|
||||||
|
"md.sys.typescale.label-medium.weight": 500.0,
|
||||||
|
"md.sys.typescale.label-medium.size": 12.0,
|
||||||
|
"md.sys.typescale.label-medium.tracking": 0.5,
|
||||||
|
"md.sys.typescale.label-medium.line-height": 1.3333332824707032
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"adin-component-search-paths": [],
|
||||||
|
"image-search-paths": [],
|
||||||
|
"vector-search-paths": []
|
||||||
|
}
|
||||||
BIN
app/src/main/ui-packages/top_app_bar/top_app_bar_preview.png
Normal file
BIN
app/src/main/ui-packages/top_app_bar/top_app_bar_preview.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
Loading…
x
Reference in New Issue
Block a user