diff --git a/app/src/main/java/com/f1rq/lifemap/MainActivity.kt b/app/src/main/java/com/f1rq/lifemap/MainActivity.kt
index 39066d7..6b1d68b 100644
--- a/app/src/main/java/com/f1rq/lifemap/MainActivity.kt
+++ b/app/src/main/java/com/f1rq/lifemap/MainActivity.kt
@@ -3,25 +3,16 @@ package com.f1rq.lifemap
import android.os.Bundle
import androidx.activity.ComponentActivity
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.wrapContentHeight
-import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.runtime.Composable
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.unit.dp
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.currentBackStackEntryAsState
import androidx.navigation.compose.rememberNavController
import com.f1rq.lifemap.navigationbar.NavigationBar
-import com.f1rq.lifemap.topappbar.TopAppBar
import com.f1rq.lifemap.screens.ListView
import com.f1rq.lifemap.screens.MapView
import com.f1rq.lifemap.screens.SettingsScreen
@@ -29,6 +20,7 @@ import com.f1rq.lifemap.screens.NotificationsScreen
import com.f1rq.lifemap.ui.theme.LifeMapTheme
import com.f1rq.lifemap.ui.theme.ActiveNavColor
import com.f1rq.lifemap.ui.theme.InactiveNavColor
+import com.f1rq.lifemap.components.TopBar
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
@@ -39,9 +31,9 @@ class MainActivity : ComponentActivity() {
Scaffold(
topBar = {
- TopAppBar(
- onSettingsIconTapped = { navController.navigate("settings")},
- onNotificationsIconTapped = { navController.navigate("notifications")}
+ TopBar(
+ onSettingsButtonClick = { navController.navigate("settings")},
+ onNotificationsButtonClick = { navController.navigate("notifications")}
)
},
bottomBar = {
diff --git a/app/src/main/java/com/f1rq/lifemap/components/AddEventCard.kt b/app/src/main/java/com/f1rq/lifemap/components/AddEventCard.kt
new file mode 100644
index 0000000..bb8c10c
--- /dev/null
+++ b/app/src/main/java/com/f1rq/lifemap/components/AddEventCard.kt
@@ -0,0 +1,98 @@
+package com.f1rq.lifemap.components
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.*
+import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Edit
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.tooling.preview.Preview
+import com.f1rq.lifemap.ui.theme.MainBG
+import com.f1rq.lifemap.ui.theme.MainTextColor
+import com.f1rq.lifemap.ui.theme.ButtonColor
+
+@Composable
+fun AddEventCard(
+ modifier: Modifier = Modifier,
+ onCreateEventClick: () -> Unit = {}
+) {
+ Card(
+ modifier = modifier
+ .fillMaxWidth()
+ .padding(16.dp),
+ shape = RoundedCornerShape(16.dp),
+ elevation = CardDefaults.cardElevation(defaultElevation = 6.dp),
+ colors = CardDefaults.cardColors(
+ containerColor = MainBG,
+ )
+ ) {
+ Row(
+ modifier = Modifier
+ .padding(
+ horizontal = 16.dp,
+ vertical = 12.dp,
+ ),
+ verticalAlignment = Alignment.CenterVertically,
+ horizontalArrangement = Arrangement.SpaceBetween
+ ) {
+ Column(
+ modifier = Modifier
+ .weight(1f)
+ ) {
+ Text(
+ text = "Add event",
+ style = MaterialTheme.typography.titleMedium,
+ color = MainTextColor
+ )
+ Text(
+ text = "With localization, date etc.",
+ style = MaterialTheme.typography.bodySmall,
+ color = MainTextColor
+ )
+ }
+
+ Box(
+ modifier = Modifier
+ .shadow(
+ elevation = 6.dp,
+ shape = RoundedCornerShape(12.dp),
+ clip = false
+ )
+ .background(
+ color = MainBG,
+ shape = RoundedCornerShape(12.dp)
+ )
+ .size(56.dp)
+ ) {
+ IconButton(
+ onClick = onCreateEventClick,
+ modifier = Modifier.fillMaxSize()
+ ) {
+ Icon(
+ imageVector = Icons.Default.Edit,
+ contentDescription = "Edit",
+ tint = ButtonColor
+ )
+ }
+ }
+
+ }
+ }
+}
+
+@Preview(showBackground = true)
+@Composable
+fun AddEventCardPreview() {
+ AddEventCard()
+}
diff --git a/app/src/main/java/com/f1rq/lifemap/components/NavBar.kt b/app/src/main/java/com/f1rq/lifemap/components/NavBar.kt
new file mode 100644
index 0000000..6ecea4d
--- /dev/null
+++ b/app/src/main/java/com/f1rq/lifemap/components/NavBar.kt
@@ -0,0 +1,32 @@
+package com.f1rq.lifemap.components
+
+
+import android.graphics.Color
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.requiredHeight
+import androidx.compose.foundation.layout.requiredWidth
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.tooling.preview.Preview
+
+
+@Composable
+fun NavBar(
+ onWorldViewTapped: () -> Unit = {},
+ onListViewTapped: () -> Unit = {},
+) {
+ Box(modifier = Modifier
+ .requiredWidth(24.0.dp)
+ .requiredHeight(24.0.dp)
+ ) {
+
+ }
+}
+
+
+@Preview
+@Composable
+fun NavBarPreview() {
+ NavBar()
+}
\ No newline at end of file
diff --git a/app/src/main/java/com/f1rq/lifemap/components/TopBar.kt b/app/src/main/java/com/f1rq/lifemap/components/TopBar.kt
new file mode 100644
index 0000000..34cf6f2
--- /dev/null
+++ b/app/src/main/java/com/f1rq/lifemap/components/TopBar.kt
@@ -0,0 +1,109 @@
+package com.f1rq.lifemap.components
+
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.*
+import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import com.f1rq.lifemap.ui.theme.MainBG
+import com.f1rq.lifemap.ui.theme.MainTextColor
+import com.f1rq.lifemap.ui.theme.ButtonColor
+import com.f1rq.lifemap.R.drawable.notifications_button
+import com.f1rq.lifemap.R.drawable.settings_button
+
+@Composable
+fun TopBar(
+ modifier: Modifier = Modifier,
+ onNotificationsButtonClick: () -> Unit = {},
+ onSettingsButtonClick: () -> Unit = {}
+) {
+ Card(
+ modifier = Modifier
+ .fillMaxWidth(),
+ shape = RoundedCornerShape(
+ topStart = 0.dp,
+ topEnd = 0.dp,
+ bottomStart = 16.dp,
+ bottomEnd = 16.dp
+ ),
+ elevation = CardDefaults.cardElevation(defaultElevation = 6.dp),
+ colors = CardDefaults.cardColors(
+ containerColor = MainBG,
+ )
+ ) {
+ Row(
+ modifier = Modifier
+ .padding(
+ start = 20.0.dp,
+ top = 65.0.dp,
+ end = 20.0.dp,
+ bottom = 15.0.dp
+ ),
+ verticalAlignment = Alignment.CenterVertically,
+ horizontalArrangement = Arrangement.SpaceBetween
+ ) {
+ Column(
+ modifier = Modifier
+ .weight(1f)
+ ) {
+ Text(
+ text = "LifeMap",
+ style = MaterialTheme.typography.titleMedium,
+ fontSize = MaterialTheme.typography.titleLarge.fontSize,
+ fontFamily = MaterialTheme.typography.titleLarge.fontFamily,
+ fontWeight = FontWeight(700.0.toInt()),
+ color = MainTextColor,
+ )
+ Text(
+ text = "Personal life events",
+ style = MaterialTheme.typography.bodySmall,
+ fontSize = MaterialTheme.typography.labelMedium.fontSize,
+ color = MainTextColor
+ )
+ }
+ Box(
+ modifier = Modifier
+ ) {
+ Row(
+ horizontalArrangement = Arrangement.spacedBy((-6).dp),
+ verticalAlignment = Alignment.CenterVertically
+ ) {
+ IconButton(
+ onClick = onNotificationsButtonClick,
+ ) {
+ Icon(
+ painter = painterResource(id = notifications_button),
+ contentDescription = "Notifications button",
+ tint = ButtonColor
+ )
+ }
+ IconButton(
+ onClick = onSettingsButtonClick,
+ ) {
+ Icon(
+ painter = painterResource(id = settings_button),
+ contentDescription = "Settings button",
+ tint = ButtonColor
+ )
+ }
+ }
+ }
+ }
+ }
+}
+
+@Preview(showBackground = true)
+@Composable
+fun TopBarPreview() {
+ TopBar()
+}
diff --git a/app/src/main/java/com/f1rq/lifemap/screens/MapView.kt b/app/src/main/java/com/f1rq/lifemap/screens/MapView.kt
index 3efd0b0..f08f4cb 100644
--- a/app/src/main/java/com/f1rq/lifemap/screens/MapView.kt
+++ b/app/src/main/java/com/f1rq/lifemap/screens/MapView.kt
@@ -6,15 +6,27 @@ import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
-import com.f1rq.lifemap.addevent.AddEvent
+import androidx.compose.ui.tooling.preview.Preview
+import com.f1rq.lifemap.components.AddEventCard
@Composable
fun MapView(modifier: Modifier = Modifier) {
Box(
- modifier = Modifier.fillMaxSize(),
- contentAlignment = Alignment.Center
+ modifier = Modifier.fillMaxSize()
) {
- AddEvent()
- Text("Map view")
+ Text(
+ text = "Map view",
+ modifier = Modifier.align(Alignment.Center)
+ )
+ AddEventCard(
+ onCreateEventClick = {},
+ modifier = Modifier.align(Alignment.BottomCenter)
+ )
}
+}
+
+@Preview
+@Composable
+fun MapViewPreview() {
+ MapView()
}
\ No newline at end of file
diff --git a/app/src/main/java/com/f1rq/lifemap/ui/theme/Color.kt b/app/src/main/java/com/f1rq/lifemap/ui/theme/Color.kt
index 34b0e2f..1546275 100644
--- a/app/src/main/java/com/f1rq/lifemap/ui/theme/Color.kt
+++ b/app/src/main/java/com/f1rq/lifemap/ui/theme/Color.kt
@@ -5,10 +5,13 @@ import androidx.compose.ui.graphics.Color
val Purple80 = Color(0xFFD0BCFF)
val PurpleGrey80 = Color(0xFFCCC2DC)
val Pink80 = Color(0xFFEFB8C8)
-
val Purple40 = Color(0xFF6650a4)
val PurpleGrey40 = Color(0xFF625b71)
val Pink40 = Color(0xFF7D5260)
+
+val MainBG = Color(0xFFECECEC)
val ActiveNavColor = Color(0xFFDDDDDD)
-val InactiveNavColor = Color.Transparent
\ No newline at end of file
+val InactiveNavColor = Color.Transparent
+val MainTextColor = Color(0xFF1D1B20)
+val ButtonColor = Color(0xFF49454F)
\ No newline at end of file
diff --git a/app/src/main/res/drawable/add_event_button.xml b/app/src/main/res/drawable/add_event_button.xml
new file mode 100644
index 0000000..c6de098
--- /dev/null
+++ b/app/src/main/res/drawable/add_event_button.xml
@@ -0,0 +1,9 @@
+
+
+
diff --git a/app/src/main/res/drawable/navbar_listview_button.xml b/app/src/main/res/drawable/navbar_listview_button.xml
new file mode 100644
index 0000000..c2a5cda
--- /dev/null
+++ b/app/src/main/res/drawable/navbar_listview_button.xml
@@ -0,0 +1,9 @@
+
+
+
diff --git a/app/src/main/res/drawable/navbar_worldview_button.xml b/app/src/main/res/drawable/navbar_worldview_button.xml
new file mode 100644
index 0000000..5c9e21d
--- /dev/null
+++ b/app/src/main/res/drawable/navbar_worldview_button.xml
@@ -0,0 +1,9 @@
+
+
+
diff --git a/app/src/main/res/drawable/notifications_button.xml b/app/src/main/res/drawable/notifications_button.xml
new file mode 100644
index 0000000..507a8d3
--- /dev/null
+++ b/app/src/main/res/drawable/notifications_button.xml
@@ -0,0 +1,9 @@
+
+
+
diff --git a/app/src/main/res/drawable/settings_button.xml b/app/src/main/res/drawable/settings_button.xml
new file mode 100644
index 0000000..b7814db
--- /dev/null
+++ b/app/src/main/res/drawable/settings_button.xml
@@ -0,0 +1,9 @@
+
+
+