NavigationDrawer

This commit is contained in:
sathwikcs
2024-10-07 17:51:41 +05:30
parent b6d1133da2
commit 679fa0ef69
6 changed files with 138 additions and 9 deletions

View File

@@ -1,17 +1,15 @@
package `in`.sminnovations.attendanceapp
import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.material3.Button
import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import `in`.sminnovations.attendanceapp.navigation.ui.NavigationDrawer
import `in`.sminnovations.attendanceapp.ui.theme.SMIAttendanceTheme
class MainActivity : ComponentActivity() {
@@ -20,10 +18,7 @@ class MainActivity : ComponentActivity() {
enableEdgeToEdge()
setContent {
SMIAttendanceTheme {
Button(onClick = { Toast.makeText(this@MainActivity, "Button Clicked", Toast.LENGTH_SHORT).show()},
modifier = Modifier.padding(4.dp)) {
}
NavigationDrawer()
}
}
}

View File

@@ -0,0 +1,8 @@
package `in`.sminnovations.attendanceapp.navigation.ui.components
import androidx.compose.runtime.Composable
@Composable
fun BottomComponents(){
}

View File

@@ -0,0 +1,70 @@
package `in`.sminnovations.attendanceapp.navigation.ui.components
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import `in`.sminnovations.attendanceapp.R
@Composable
fun TopComponents() {
Column(
modifier = Modifier.fillMaxWidth().padding(16.dp),
horizontalAlignment = Alignment.CenterHorizontally
) {
// Image with rounded corners
Image(
painter = painterResource(id = R.drawable.smi_logo), // replace with your image resource
contentDescription = "Profile Photo",
contentScale = ContentScale.Crop,
modifier = Modifier.size(100.dp).clip(RoundedCornerShape(16.dp))
)
Spacer(modifier = Modifier.height(16.dp))
// Name
Text(
text = "John Doe",
style = MaterialTheme.typography.titleMedium,
fontWeight = FontWeight.Bold,
fontSize = 20.sp,
color = MaterialTheme.colorScheme.onSurface
)
Spacer(modifier = Modifier.height(8.dp))
// ID
Text(
text = "ID: 123456",
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant,
fontSize = 16.sp
)
Spacer(modifier = Modifier.height(4.dp))
// Designation
Text(
text = "Software Engineer",
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.primary,
fontSize = 16.sp
)
}
}

View File

@@ -1,2 +1,54 @@
package `in`.sminnovations.attendanceapp.navigation.ui
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.DrawerValue
import androidx.compose.material3.ExtendedFloatingActionButton
import androidx.compose.material3.Icon
import androidx.compose.material3.ModalDrawerSheet
import androidx.compose.material3.ModalNavigationDrawer
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.rememberDrawerState
import androidx.compose.runtime.Composable
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Modifier
import kotlinx.coroutines.launch
import `in`.sminnovations.attendanceapp.navigation.ui.components.TopComponents
@Composable
fun NavigationDrawer(){
val drawerState = rememberDrawerState(initialValue = DrawerValue.Closed)
val scope = rememberCoroutineScope()
ModalNavigationDrawer(
drawerState = drawerState,
drawerContent = {
ModalDrawerSheet { /* Drawer content */
TopComponents()
}
},
) {
Scaffold(
floatingActionButton = {
ExtendedFloatingActionButton(
text = { Text("Show drawer") },
icon = { Icon(Icons.Filled.Add, contentDescription = "") },
onClick = {
scope.launch {
drawerState.apply {
if (isClosed) open() else close()
}
}
}
)
}
) { contentPadding ->
Column (modifier = Modifier.padding(contentPadding)){
}
}
}
}

View File

@@ -0,0 +1,4 @@
package `in`.sminnovations.attendanceapp.navigation.viewModel
class navigationViewModel {
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB