Introduce base of new UI navigation

This commit is contained in:
Shinokuni 2023-02-26 16:18:30 +01:00
parent c7d83362f9
commit c2585f2dac
8 changed files with 231 additions and 18 deletions

View File

@ -118,6 +118,15 @@ dependencies {
androidTestImplementation composeBom
implementation 'androidx.activity:activity-compose:1.5.1'
implementation 'androidx.compose.material:material'
implementation 'androidx.compose.material3:material3'
def voyager = "1.0.0-rc03"
implementation "cafe.adriel.voyager:voyager-navigator:$voyager"
implementation "cafe.adriel.voyager:voyager-bottom-sheet-navigator:$voyager"
implementation "cafe.adriel.voyager:voyager-tab-navigator:$voyager"
implementation "cafe.adriel.voyager:voyager-androidx:$voyager"
//implementation "cafe.adriel.voyager:voyager-koin:$voyager"
debugImplementation "androidx.compose.ui:ui-tooling:1.3.3"
implementation "androidx.compose.ui:ui-tooling-preview:1.3.3"
}

View File

@ -1,35 +1,92 @@
package com.readrops.app
import android.os.Bundle
import android.os.PersistableBundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Scaffold
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.AccountBox
import androidx.compose.material.icons.filled.MoreVert
import androidx.compose.material3.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import cafe.adriel.voyager.navigator.CurrentScreen
import cafe.adriel.voyager.navigator.Navigator
import com.readrops.app.compose.ReadropsTheme
import com.readrops.app.compose.account.AccountScreen
import com.readrops.app.compose.feeds.FeedsScreen
import com.readrops.app.compose.more.MoreScreen
import com.readrops.app.compose.timelime.TimelineScreen
class BaseActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?, persistentState: PersistableBundle?) {
super.onCreate(savedInstanceState, persistentState)
@OptIn(ExperimentalMaterial3Api::class)
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
MaterialTheme {
Scaffold { paddingValues ->
Box(
modifier = Modifier.padding(paddingValues)
) {
Row {
Text(
text = "Hello World",
)
ReadropsTheme {
Navigator(screen = TimelineScreen()) { navigator ->
Scaffold(
bottomBar = {
BottomAppBar {
NavigationBarItem(
selected = false,
onClick = { navigator.push(TimelineScreen()) },
icon = {
Icon(
painter = painterResource(R.drawable.ic_timeline),
contentDescription = null
)
},
label = { Text("Timeline") }
)
NavigationBarItem(
selected = false,
onClick = { navigator.push(FeedsScreen()) },
icon = {
Icon(
painter = painterResource(R.drawable.ic_rss_feed_grey),
contentDescription = null
)
},
label = { Text("Feeds") }
)
NavigationBarItem(
selected = false,
onClick = { navigator.push(AccountScreen()) },
icon = {
Icon(
imageVector = Icons.Default.AccountBox,
contentDescription = null,
)
},
label = { Text("Account") }
)
NavigationBarItem(
selected = false,
onClick = { navigator.push(MoreScreen()) },
icon = {
Icon(
imageVector = Icons.Default.MoreVert,
contentDescription = null,
)
},
label = { Text("More") }
)
}
},
) { paddingValues ->
Box(
modifier = Modifier.padding(paddingValues)
) {
CurrentScreen()
}
}
}
}
}

View File

@ -0,0 +1,17 @@
package com.readrops.app.compose.account
import androidx.compose.foundation.layout.Column
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import cafe.adriel.voyager.androidx.AndroidScreen
class AccountScreen : AndroidScreen() {
@Composable
override fun Content() {
Column {
Text(text = "Account")
}
}
}

View File

@ -0,0 +1,18 @@
package com.readrops.app.compose.feeds
import androidx.compose.foundation.layout.Column
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import cafe.adriel.voyager.androidx.AndroidScreen
class FeedsScreen : AndroidScreen() {
@Composable
override fun Content() {
Column {
Text(
text = "Feeds"
)
}
}
}

View File

@ -0,0 +1,18 @@
package com.readrops.app.compose.more
import androidx.compose.foundation.layout.Column
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import cafe.adriel.voyager.androidx.AndroidScreen
class MoreScreen : AndroidScreen() {
@Composable
override fun Content() {
Column {
Text(
text = "More"
)
}
}
}

View File

@ -0,0 +1,71 @@
package com.readrops.app.compose.timelime
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.material3.Card
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
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.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
@Preview
@Composable
fun TimelineItem() {
Card(
// elevation = 4.card,
modifier = Modifier.background(Color.White)
.padding(8.dp)
) {
Column(
modifier = Modifier
.fillMaxWidth()
.padding(8.dp)
) {
Row(
horizontalArrangement = Arrangement.SpaceBetween,
modifier = Modifier.fillMaxWidth()
) {
Row(
verticalAlignment = Alignment.CenterVertically,
) {
Icon(
painter = painterResource(id = com.readrops.app.R.drawable.ic_rss_feed_grey),
contentDescription = null,
// modifier = Modifier.size((MaterialTheme.typography.subtitle2.fontSize.value * 1.5).dp)
)
// Spacer(Modifier.padding(4.dp))
Text(
text = "feed name",
//style = MaterialTheme.typography.
)
}
Text(
text = "Item date",
// style = MaterialTheme.typography.subtitle2
)
}
Spacer(Modifier.size(8.dp))
Text(
text = "title example",
//style = MaterialTheme.typography.h5,
)
Spacer(Modifier.size(8.dp))
/* Image(
painter = painterResource(id = com.readrops.app.R.drawable.header_background),
contentDescription = null
)*/
}
}
}

View File

@ -0,0 +1,18 @@
package com.readrops.app.compose.timelime
import androidx.compose.foundation.layout.Column
import androidx.compose.runtime.Composable
import cafe.adriel.voyager.androidx.AndroidScreen
class TimelineScreen : AndroidScreen() {
@Composable
override fun Content() {
Column {
TimelineItem()
}
}
}

View File

@ -0,0 +1,5 @@
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M19,3H5C3.9,3 3,3.9 3,5v14c0,1.1 0.9,2 2,2h14c1.1,0 2,-0.9 2,-2V5C21,3.9 20.1,3 19,3zM12,17H6v-2h6V17zM15,13H9v-2h6V13zM18,9h-6V7h6V9z"/>
</vector>