Skip to content

Commit

Permalink
1.0.0-alpha07 release version with good integration with Material 3
Browse files Browse the repository at this point in the history
  • Loading branch information
kevingermainbusiness committed May 31, 2022
1 parent 7ebd66e commit b681fdf
Show file tree
Hide file tree
Showing 11 changed files with 184 additions and 105 deletions.
6 changes: 3 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ repositories {

```groovy
dependencies {
implementation 'com.github.germainkevinbusiness:CollapsingTopBarCompose:1.0.0-alpha06'
implementation 'com.github.germainkevinbusiness:CollapsingTopBarCompose:1.0.0-alpha07'
}
```

Expand All @@ -49,7 +49,7 @@ In order to use a ```CollapsingTopBar```, you first need to create a ```TopBarSc

```kotlin
val scrollBehavior = remember {
CollapsingTopBarDefaults.behaviorOnScroll(
CollapsingTopBarDefaults.scrollBehavior(
isAlwaysCollapsed = false,
isInitiallyCollapsed = true,
collapsedTopBarHeight = 56.dp,
Expand Down Expand Up @@ -81,7 +81,7 @@ So when we put it all together we got:
```kotlin

val scrollBehavior = remember {
CollapsingTopBarDefaults.behaviorOnScroll(
CollapsingTopBarDefaults.scrollBehavior(
isAlwaysCollapsed = false,
isInitiallyCollapsed = true,
collapsedTopBarHeight = 56.dp,
Expand Down
3 changes: 2 additions & 1 deletion app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ android {
minSdk 21
targetSdk 32
versionCode 1
versionName "1.0.0-alpha06"
versionName "1.0.0-alpha07"

testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
vectorDrawables {
Expand Down Expand Up @@ -55,6 +55,7 @@ dependencies {


// Compose dependencies
implementation "androidx.compose.material:material:$compose_version"
implementation "androidx.compose.ui:ui:$compose_version"
implementation "androidx.compose.ui:ui-tooling-preview:$compose_version"
implementation "androidx.compose.material:material-icons-extended:$compose_version"
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,22 @@ package com.germainkevin.collapsingtopbarcompose
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material.Scaffold
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Email
import androidx.compose.material.icons.filled.Face
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material.icons.filled.Menu
import androidx.compose.material.rememberScaffoldState
import androidx.compose.material3.*
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Modifier
import androidx.compose.ui.input.nestedscroll.nestedScroll
import androidx.compose.ui.platform.LocalContext
Expand All @@ -19,9 +28,12 @@ import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.germainkevin.collapsingtopbar.CollapsingTopBar
import com.germainkevin.collapsingtopbar.CollapsingTopBarDefaults
import com.germainkevin.collapsingtopbarcompose.ui.ContactListNames
import com.germainkevin.collapsingtopbarcompose.ui.LeftDrawer
import com.germainkevin.collapsingtopbarcompose.ui.MoreMenuIcons
import com.germainkevin.collapsingtopbarcompose.ui.theme.CollapsingTopBarComposeTheme
import kotlinx.coroutines.launch

@OptIn(ExperimentalMaterial3Api::class)
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
Expand All @@ -32,18 +44,46 @@ class MainActivity : ComponentActivity() {
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colorScheme.background
) {
val coroutineScope = rememberCoroutineScope()
val scaffoldState = rememberScaffoldState()

val openLeftDrawer: () -> Unit = {
coroutineScope.launch {
scaffoldState.drawerState.open()
}
}
val closeLeftDrawer: () -> Unit = {
coroutineScope.launch {
scaffoldState.drawerState.close()
}
}

// icons to mimic drawer destinations
val items =
listOf(Icons.Default.Favorite, Icons.Default.Face, Icons.Default.Email)

val context = LocalContext.current
val contactNames = context.resources.getStringArray(R.array.contactNames)
// A scrollBehavior determines the behavior of the CollapsingTopBar
// when it is being scrolled and also to track the nestedScroll events

/**
* A scrollBehavior determines the behavior of the CollapsingTopBar when it is
* being scrolled and also to track the nestedScroll events*/
val scrollBehavior = remember {
CollapsingTopBarDefaults.behaviorOnScroll(
CollapsingTopBarDefaults.scrollBehavior(
isAlwaysCollapsed = false,
isExpandedWhenFirstDisplayed = false,
expandedTopBarMaxHeight = 256.dp,
)
}
Scaffold(
modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection),
scaffoldState = scaffoldState,
drawerContent = {
LeftDrawer(
closeLeftDrawer = closeLeftDrawer,
drawerItems = items
)
},
topBar = {
CollapsingTopBar(
scrollBehavior = scrollBehavior,
Expand All @@ -54,7 +94,7 @@ class MainActivity : ComponentActivity() {
style = LocalTextStyle.current.copy(
fontSize = 24.sp,
fontWeight = FontWeight.Normal,
color = MaterialTheme.colorScheme.primary
color = MaterialTheme.colorScheme.onPrimary
)
)
},
Expand All @@ -66,16 +106,16 @@ class MainActivity : ComponentActivity() {
),
style = LocalTextStyle.current.copy(
fontWeight = FontWeight.Normal,
color = MaterialTheme.colorScheme.onPrimaryContainer
color = MaterialTheme.colorScheme.onPrimary
)
)
},
navigationIcon = {
IconButton(onClick = { }) {
IconButton(onClick = openLeftDrawer) {
Icon(
imageVector = Icons.Filled.Menu,
contentDescription = stringResource(id = R.string.hamburger_menu),
tint = MaterialTheme.colorScheme.primary
tint = MaterialTheme.colorScheme.onPrimary
)
}
},
Expand All @@ -84,9 +124,13 @@ class MainActivity : ComponentActivity() {
},
content = { innerPadding ->
LazyColumn(
modifier = Modifier.background(MaterialTheme.colorScheme.background),
contentPadding = innerPadding,
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
item {
Spacer(modifier = Modifier.height(6.dp))
}
items(count = contactNames.size) {
ContactListNames(context, contactNames[it])
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
package com.germainkevin.collapsingtopbarcompose

import android.content.Context
import android.widget.Toast

fun createToast(context: Context, message: String) =
Toast.makeText(context, message, Toast.LENGTH_LONG).show()
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
package com.germainkevin.collapsingtopbarcompose.ui

import android.content.Context
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.MoreVert
import androidx.compose.material.icons.outlined.Search
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.germainkevin.collapsingtopbarcompose.R
import com.germainkevin.collapsingtopbarcompose.createToast

@Composable
fun ContactListNames(context: Context, contactName: String) {
Row(
modifier = Modifier
.fillMaxWidth()
.background(MaterialTheme.colorScheme.background)
.clickable { createToast(context, contactName) },
verticalAlignment = Alignment.CenterVertically
) {
Text(
text = contactName,
style = MaterialTheme.typography.bodyLarge
.copy(color = MaterialTheme.colorScheme.onBackground),
modifier = Modifier
.fillMaxWidth()
.padding(16.dp)
)
}
}

@Composable
fun MoreMenuIcons() {
IconButton(onClick = { }) {
Icon(
Icons.Outlined.Search,
contentDescription = stringResource(id = R.string.action_search),
tint = MaterialTheme.colorScheme.onPrimary
)
}
IconButton(onClick = {
}) {
Icon(
Icons.Outlined.MoreVert,
contentDescription = stringResource(id = R.string.more_menu_desc),
tint = MaterialTheme.colorScheme.onPrimary
)
}
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun LeftDrawer(
drawerItems: List<ImageVector>,
closeLeftDrawer: () -> Unit
) {
val selectedItem = remember { mutableStateOf(drawerItems[0]) }
Column(
modifier = Modifier
.fillMaxSize()
.background(MaterialTheme.colorScheme.background)
) {
drawerItems.forEach { item ->
NavigationDrawerItem(
icon = { Icon(item, contentDescription = null) },
label = { Text(item.name) },
selected = item == selectedItem.value,
onClick = {
selectedItem.value = item
closeLeftDrawer()
},
shape = RoundedCornerShape(topEnd = 24.dp, bottomEnd = 24.dp),
badge = { Text(text = " 20") },
modifier = Modifier.padding(end = 16.dp, top = 12.dp, bottom = 12.dp)
)
}
}
}
2 changes: 1 addition & 1 deletion collapsingtopbar/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ afterEvaluate {
// You can then customize attributes of the publication as shown below.
groupId = 'com.germainkevin.collapsingtopbarcompose'
artifactId = 'collapsingtopbarcompose'
version = '1.0.0-alpha06'
version = '1.0.0-alpha07'
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ fun CollapsingTopBar(
navigationIcon: @Composable (() -> Unit)? = null,
actions: @Composable RowScope.() -> Unit = {},
centeredTitleAndSubtitle: Boolean = true,
colors: CollapsingTopBarColors = CollapsingTopBarDefaults.collapsingTopBarColors(),
colors: CollapsingTopBarColors = CollapsingTopBarDefaults.colors(),
contentPadding: PaddingValues = CollapsingTopBarDefaults.ContentPadding,
elevation: Dp = 0.dp,
scrollBehavior: TopBarScrollBehavior
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ interface CollapsingTopBarColors {
var contentColor: Color
}

class CollapsingTopBarColorsImpl(
class DefaultCollapsingTopBarColors(
override var backgroundColor: Color,
override var contentColor: Color
) : CollapsingTopBarColors
Loading

0 comments on commit b681fdf

Please sign in to comment.