Bläddra i källkod

@fun: LoginScreen.kt

bai 3 år sedan
förälder
incheckning
6d18e57f26
29 ändrade filer med 503 tillägg och 183 borttagningar
  1. 3 0
      app/build.gradle.kts
  2. 5 1
      app/src/main/java/com/ys/bdtp/adm/AdmApplication.kt
  3. 19 3
      app/src/main/java/com/ys/bdtp/adm/App.kt
  4. 14 6
      app/src/main/java/com/ys/bdtp/adm/MainActivity.kt
  5. 4 0
      app/src/main/java/com/ys/bdtp/adm/mvvm/model/vo/Temp.kt
  6. 0 16
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/flash/FlashScreen.kt
  7. 0 156
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/login/LoginScreen.kt
  8. 278 0
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/login/LoginScreen.kt
  9. 1 1
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/main/MainScreen.kt
  10. 82 0
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/project/ProjectItem.kt
  11. 97 0
      app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/project/ProjectScreen.kt
  12. BIN
      app/src/main/res/drawable-hdpi/login_background.png
  13. BIN
      app/src/main/res/drawable-hdpi/login_delete.png
  14. BIN
      app/src/main/res/drawable-hdpi/login_eye_close.png
  15. BIN
      app/src/main/res/drawable-hdpi/login_eye_open.png
  16. BIN
      app/src/main/res/drawable-hdpi/login_lock.png
  17. BIN
      app/src/main/res/drawable-hdpi/login_user.png
  18. BIN
      app/src/main/res/drawable-hdpi/logo.png
  19. BIN
      app/src/main/res/drawable-xhdpi/login_background.png
  20. BIN
      app/src/main/res/drawable-xhdpi/login_delete.png
  21. BIN
      app/src/main/res/drawable-xhdpi/login_eye_close.png
  22. BIN
      app/src/main/res/drawable-xhdpi/login_eye_open.png
  23. BIN
      app/src/main/res/drawable-xhdpi/login_lock.png
  24. BIN
      app/src/main/res/drawable-xhdpi/login_user.png
  25. BIN
      app/src/main/res/drawable-xhdpi/logo.png
  26. BIN
      app/src/main/res/drawable-xhdpi/project_item_placeholder.png
  27. BIN
      app/src/main/res/drawable-xxhdpi/icon_trailing_del.png
  28. BIN
      app/src/main/res/drawable-xxhdpi/icon_trailing_pwd_hide.png
  29. BIN
      app/src/main/res/drawable-xxhdpi/icon_trailing_pwd_show.png

+ 3 - 0
app/build.gradle.kts

@@ -118,6 +118,9 @@ dependencies {
     implementation(Deps.Androidx.Compose)
     implementation(Deps.Lifecycle.Compose)
     implementation(Deps.Navigation.Compose)
+    implementation("com.google.accompanist:accompanist-insets:0.20.3")
+    implementation("com.google.accompanist:accompanist-insets-ui:0.20.3")
+    implementation("com.google.accompanist:accompanist-systemuicontroller:0.20.3")
 
     // test
     testImplementation(Deps.Test.Junit)

+ 5 - 1
app/src/main/java/com/ys/bdtp/adm/AdmApplication.kt

@@ -4,4 +4,8 @@ import android.app.Application
 import org.kodein.di.DI
 import org.kodein.di.DIAware
 
-class AdmApplication : Application()
+class AdmApplication : Application(),DIAware{
+    override val di: DI
+        get() = TODO("Not yet implemented")
+
+}

+ 19 - 3
app/src/main/java/com/ys/bdtp/adm/App.kt

@@ -2,20 +2,36 @@ package com.ys.bdtp.adm
 
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Surface
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.SideEffect
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
+import com.google.accompanist.insets.ProvideWindowInsets
+import com.google.accompanist.systemuicontroller.rememberSystemUiController
 import com.ys.bdtp.adm.app.theme.AdmTheme
 import com.ys.bdtp.adm.di.di
+import com.ys.bdtp.adm.mvvm.ui.screen.login.LoginScreen
 import org.kodein.di.compose.onDIContext
 import org.kodein.di.compose.withDI
 
 @Composable
 fun App() = withDI(di(LocalContext.current)) {
+
     onDIContext(LocalContext.current) {
+        val systemUiController = rememberSystemUiController()
+        val useDarkIcons = MaterialTheme.colors.isLight
+
         AdmTheme {
-            Surface(color = MaterialTheme.colors.background) {
-                Text("Android")
+            ProvideWindowInsets {
+                Surface(color = MaterialTheme.colors.background) {
+                    SideEffect {
+                        systemUiController.setStatusBarColor(
+                            color = Color.Transparent,
+                            darkIcons = useDarkIcons
+                        )
+                    }
+                    LoginScreen()
+                }
             }
         }
     }

+ 14 - 6
app/src/main/java/com/ys/bdtp/adm/MainActivity.kt

@@ -3,18 +3,26 @@ package com.ys.bdtp.adm
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.tooling.preview.Preview
-import com.ys.bdtp.adm.app.theme.AdmTheme
+import androidx.core.view.WindowCompat
 
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
+        WindowCompat.setDecorFitsSystemWindows(window, false)
         setContent {
             App()
         }
+        /* setContent {
+             // Update the system bars to be translucent
+             val systemUiController = rememberSystemUiController()
+             val useDarkIcons = MaterialTheme.colors.isLight
+             SideEffect {
+                 systemUiController.setSystemBarsColor(Color.Transparent, darkIcons = useDarkIcons)
+             }
+
+             ProvideWindowInsets {
+                 Sample()
+             }
+         }*/
     }
 }

+ 4 - 0
app/src/main/java/com/ys/bdtp/adm/mvvm/model/vo/Temp.kt

@@ -0,0 +1,4 @@
+package com.ys.bdtp.adm.mvvm.model.vo
+
+class Temp {
+}

+ 0 - 16
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/flash/FlashScreen.kt

@@ -1,16 +0,0 @@
-package com.ys.bdtp.adm.mvvm.ui.flash
-
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.width
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
-
-@Composable
-fun FlashScreen() {
-    Box(modifier = Modifier.fillMaxSize().width(404.dp)) {
-        Text(text = "Flash")
-    }
-}

+ 0 - 156
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/login/LoginScreen.kt

@@ -1,156 +0,0 @@
-package com.ys.bdtp.adm.mvvm.ui.login
-
-import androidx.compose.foundation.background
-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.layout.width
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
-import androidx.compose.material.ButtonDefaults
-import androidx.compose.material.Icon
-import androidx.compose.material.IconButton
-import androidx.compose.material.OutlinedTextField
-import androidx.compose.material.Text
-import androidx.compose.material.TextFieldDefaults
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.runtime.setValue
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.input.PasswordVisualTransformation
-import androidx.compose.ui.text.input.VisualTransformation
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
-import com.ys.bdtp.adm.R
-import com.ys.bdtp.adm.mvvm.vm.login.LoginViewModel
-import org.kodein.di.compose.rememberViewModel
-
-@Composable
-fun LoginScreen() {
-    val vm by rememberViewModel<LoginViewModel>()
-
-    var isShowPassword by remember { mutableStateOf(false) }
-    var isLoginBtnEnable by remember { mutableStateOf(false) }
-
-    var account by remember { mutableStateOf("") }
-    var password by remember { mutableStateOf("") }
-
-    var visualState: VisualTransformation by remember { mutableStateOf(PasswordVisualTransformation()) }
-
-
-    Column(
-        modifier = Modifier
-            .width(404.dp)
-            .height(444.dp)
-            .background(Color.White)
-            .padding(start = 32.dp, top = 48.dp, end = 32.dp, bottom = 56.dp)
-    ) {
-        Text(text = "账号登录", fontSize = 28.sp)
-        Spacer(modifier = Modifier.height(10.dp))
-        Text(text = "你好,欢迎来到工单系统", color = Color(0xFF8D9399), fontSize = 12.sp)
-        Spacer(modifier = Modifier.height(36.dp))
-
-        // 账号文本框
-        OutlinedTextField(
-            value = account,
-            modifier = Modifier.fillMaxWidth(),
-            onValueChange = {
-                account = it
-                isLoginBtnEnable = account.isNotEmpty() && password.isNotEmpty()
-            },
-            label = {
-                Text(text = "请输入账号", color = Color(0xFFC3C7CB))
-            },
-            colors = TextFieldDefaults.outlinedTextFieldColors(
-                textColor = Color(0xFF1F2529),
-                cursorColor = Color(0xFF0091FF),
-                focusedBorderColor = Color(0xFF0091FF),
-                focusedLabelColor = Color(0xFF0091FF),
-                backgroundColor = Color.Transparent
-            ),
-            trailingIcon = {
-                IconButton(
-                    onClick = { account = "" },
-                    enabled = account.isNotEmpty()
-                ) {
-                    if (account.isNotBlank())
-                        Icon(
-                            painter = painterResource(R.drawable.icon_trailing_del),
-                            contentDescription = "",
-                            modifier = Modifier.size(16.dp),
-                            tint = Color(0xFFC3C6CB)
-                        )
-                }
-            }
-        )
-
-        Spacer(modifier = Modifier.height(16.dp))
-
-        // 密码文本框
-        OutlinedTextField(
-            value = password,
-            modifier = Modifier.fillMaxWidth(),
-            onValueChange = {
-                password = it
-                isLoginBtnEnable = account.isNotEmpty() && password.isNotEmpty()
-            }, label = {
-                Text(text = "请输入密码", color = Color(0xFFC3C7CB))
-            },
-            colors = TextFieldDefaults.outlinedTextFieldColors(
-                textColor = Color(0xFF1F2529),
-                cursorColor = Color(0xFF0091FF),
-                focusedBorderColor = Color(0xFF0091FF),
-                focusedLabelColor = Color(0xFF0091FF),
-                backgroundColor = Color.Transparent
-            ),
-            visualTransformation = visualState,
-            trailingIcon = {
-                IconButton(onClick = { isShowPassword = !isShowPassword }) {
-                    val icon =
-                        if (isShowPassword) R.drawable.icon_trailing_pwd_show else R.drawable.icon_trailing_pwd_hide
-                    visualState =
-                        if (isShowPassword) VisualTransformation.None else PasswordVisualTransformation()
-                    val description = if (isShowPassword) "Show password" else "Hide password"
-                    Icon(
-                        painter = painterResource(icon),
-                        contentDescription = description,
-                        modifier = Modifier.size(16.dp),
-                        tint = Color(0xFFC3C6CB)
-                    )
-                }
-            }
-        )
-
-        Spacer(modifier = Modifier.height(48.dp))
-
-        Button(
-            onClick = {
-                // TODO
-                // 处理完后清空数据
-                isLoginBtnEnable = account.isNotEmpty() && password.isNotEmpty()
-            },
-            enabled = isLoginBtnEnable,
-            modifier = Modifier.fillMaxWidth().height(50.dp),
-            shape = RoundedCornerShape(50),
-            colors = ButtonDefaults.buttonColors(
-                backgroundColor = Color(0xFF0091FF)
-            )
-        ) {
-            Text(text = "登录", color = Color(0XFFFFFFFF), fontSize = 16.sp)
-        }
-    }
-}
-
-@Preview
-@Composable
-fun PreviewLoginScreen() {
-    LoginScreen()
-}

+ 278 - 0
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/login/LoginScreen.kt

@@ -0,0 +1,278 @@
+package com.ys.bdtp.adm.mvvm.ui.screen.login
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.fillMaxSize
+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.layout.wrapContentHeight
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Button
+import androidx.compose.material.ButtonDefaults
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.OutlinedTextField
+import androidx.compose.material.Text
+import androidx.compose.material.TextFieldDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.focus.FocusState
+import androidx.compose.ui.focus.onFocusChanged
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.ui.text.input.VisualTransformation
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.google.accompanist.insets.LocalWindowInsets
+import com.google.accompanist.insets.rememberInsetsPaddingValues
+import com.ys.bdtp.adm.R
+
+@Composable
+fun LoginScreen() {
+    // val vm by rememberViewModel<LoginViewModel>()
+    val insets = LocalWindowInsets.current
+    println("insets: ${insets.statusBars.layoutInsets.left}")
+    println("insets: ${insets.statusBars.layoutInsets.bottom}")
+    val imeBottom = with(LocalDensity.current) { insets.ime.bottom.toDp() }
+    println("insets: $imeBottom")
+
+    var isShowPassword by remember { mutableStateOf(false) }
+    var isLoginBtnEnable by remember { mutableStateOf(false) }
+
+    var username by remember { mutableStateOf("") }
+    var password by remember { mutableStateOf("") }
+
+    var visualState: VisualTransformation by remember { mutableStateOf(PasswordVisualTransformation()) }
+
+    var usernameLeadingIconColor by remember { mutableStateOf(Color(0xFFC3C7CB)) }
+    var passwordLeadingIconColor by remember { mutableStateOf(Color(0xFFC3C7CB)) }
+
+    Row(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(Color.White)
+
+
+    ) {
+        Box(
+            modifier = Modifier.weight(3.0f).fillMaxHeight()
+        ) {
+
+
+            Image(
+                painter = painterResource(R.drawable.login_background),
+                contentDescription = "",
+                modifier = Modifier.fillMaxSize(),
+                contentScale = ContentScale.Crop
+            )
+
+            Column(
+                modifier = Modifier.fillMaxSize().padding(
+                    rememberInsetsPaddingValues(
+                        LocalWindowInsets.current.statusBars,
+                        additionalStart = 32.dp,
+                        additionalTop = 12.dp
+
+                    )
+                )
+            ) {
+                Icon(
+                    painter = painterResource(R.drawable.logo),
+                    contentDescription = "",
+                    modifier = Modifier.size(112.dp, 48.dp)
+                )
+            }
+
+            Column(modifier = Modifier.align(Alignment.Center)) {
+                Text(text = "Yushu", fontSize = 36.sp, color = Color(0XFF1F2429))
+                Text("智慧建筑运维平台", fontSize = 48.sp, color = Color(0XFF1F2429))
+                Text("为您提供什么服务,能够用一句话概括出来吧。", fontSize = 16.sp, color = Color(0XFF8D9399))
+            }
+        }
+
+        Column(
+            modifier = Modifier.weight(2.0f)
+                .fillMaxHeight()
+                .padding(start = 56.dp, end = 96.dp),
+            verticalArrangement = Arrangement.Center
+        ) {
+            Column(modifier = Modifier.wrapContentHeight()) {
+                Text(text = "登录", fontSize = 30.sp, color = Color(0XFF1F2429))
+                Spacer(modifier = Modifier.height(32.dp))
+
+                OutlinedTextField(
+                    value = username,
+                    modifier = Modifier.fillMaxWidth().onFocusChanged { focusState: FocusState ->
+                        if (focusState.isFocused)
+                            usernameLeadingIconColor = Color(0xFF0091FF)
+                        else
+                            usernameLeadingIconColor = Color(0xFFC3C7CB)
+                    },
+                    onValueChange = {
+                        username = it
+                        isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
+
+                    },
+                    label = {
+                        Text(text = "请输入账号")
+                    },
+                    colors = TextFieldDefaults.outlinedTextFieldColors(
+                        textColor = Color(0xFF1F2429),
+                        cursorColor = Color(0xFF0091FF),
+                        focusedBorderColor = Color(0xFF0091FF),
+                        unfocusedBorderColor = Color(0xFFC3C7CB),
+                        focusedLabelColor = Color(0xFF0091FF),
+                        unfocusedLabelColor = Color(0xFFC3C7CB),
+                        backgroundColor = Color.Transparent
+                    ),
+                    leadingIcon = {
+                        Icon(
+                            painter = painterResource(R.drawable.login_user),
+                            contentDescription = "",
+                            tint = usernameLeadingIconColor
+                        )
+                    },
+                    trailingIcon = {
+                        if (username.isNotBlank()) {
+                            IconButton(
+                                onClick = { username = "" },
+                                enabled = username.isNotEmpty()
+                            ) {
+
+                                Icon(
+                                    painter = painterResource(R.drawable.login_delete),
+                                    contentDescription = "",
+                                    modifier = Modifier.size(16.dp),
+                                    tint = Color(0xFFC3C6CB)
+                                )
+                            }
+                        }
+                    },
+                    shape = RoundedCornerShape(4.dp)
+                )
+
+                Spacer(modifier = Modifier.height(32.dp))
+
+                OutlinedTextField(
+                    value = password,
+                    modifier = Modifier.fillMaxWidth()
+                        .onFocusChanged { focusState ->
+                            if (focusState.isFocused)
+                                passwordLeadingIconColor = Color(0xFF0091FF)
+                            else
+                                passwordLeadingIconColor = Color(0xFFC3C7CB)
+                        },
+                    onValueChange = {
+                        password = it
+                        isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
+                    },
+                    label = { Text(text = "请输入密码") },
+                    colors = TextFieldDefaults.outlinedTextFieldColors(
+                        textColor = Color(0xFF1F2429),
+                        cursorColor = Color(0xFF0091FF),
+                        focusedBorderColor = Color(0xFF0091FF),
+                        unfocusedBorderColor = Color(0xFFC3C7CB),
+                        focusedLabelColor = Color(0xFF0091FF),
+                        unfocusedLabelColor = Color(0xFFC3C7CB),
+                        backgroundColor = Color.Transparent
+                    ),
+                    visualTransformation = visualState,
+                    leadingIcon = {
+                        Icon(
+                            painter = painterResource(R.drawable.login_lock),
+                            contentDescription = "",
+                            tint = passwordLeadingIconColor
+                        )
+                    },
+                    trailingIcon = {
+                        Row(
+                            horizontalArrangement = Arrangement.End,
+                            verticalAlignment = Alignment.CenterVertically
+                        ) {
+                            if (password.isNotBlank()) {
+                                IconButton(
+                                    onClick = { isShowPassword = !isShowPassword }
+                                ) {
+                                    val icon =
+                                        if (isShowPassword) R.drawable.login_eye_open else R.drawable.login_eye_close
+                                    visualState =
+                                        if (isShowPassword) VisualTransformation.None else PasswordVisualTransformation()
+                                    val description = if (isShowPassword) "Show password" else "Hide password"
+                                    Icon(
+                                        painter = painterResource(icon),
+                                        contentDescription = description,
+                                        modifier = Modifier.size(18.dp).padding(0.dp),
+                                        tint = Color(0xFFC3C6CB)
+                                    )
+                                }
+
+                                IconButton(
+                                    onClick = {
+                                        password = ""
+                                        isShowPassword = false
+                                    },
+                                    enabled = password.isNotEmpty()
+                                ) {
+                                    Icon(
+                                        painter = painterResource(R.drawable.login_delete),
+                                        contentDescription = "",
+                                        modifier = Modifier.size(18.dp),
+                                        tint = Color(0xFFC3C6CB)
+                                    )
+                                }
+                            }
+                        }
+                    }
+                )
+            }
+
+            Spacer(modifier = Modifier.height(48.dp))
+
+            Button(
+                onClick = {
+                    // TODO
+                    // 处理完后清空数据
+                    isLoginBtnEnable = username.isNotEmpty() && password.isNotEmpty()
+                    // TODO
+                    // 返回登录结果进行处理
+                },
+                enabled = isLoginBtnEnable,
+                modifier = Modifier.fillMaxWidth().height(48.dp),
+                shape = RoundedCornerShape(4),
+                colors = ButtonDefaults.buttonColors(
+                    backgroundColor = Color(0xFF0091FF),
+                    disabledBackgroundColor = Color(0xFFEFF0F1)
+                )
+            ) {
+                Text(
+                    text = "立即登录",
+                    color = if (isLoginBtnEnable) Color(0xFFFFFFFF) else Color(0XFFC3C7CB),
+                    fontSize = 16.sp
+                )
+            }
+        }
+    }
+}
+
+@Preview(widthDp = 1280, heightDp = 800)
+@Composable
+fun PreviewLoginScreen() {
+    LoginScreen()
+}

+ 1 - 1
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/main/MainScreen.kt

@@ -1,4 +1,4 @@
-package com.ys.bdtp.adm.mvvm.ui.main
+package com.ys.bdtp.adm.mvvm.ui.screen.main
 
 import androidx.compose.runtime.Composable
 

+ 82 - 0
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/project/ProjectItem.kt

@@ -0,0 +1,82 @@
+package com.ys.bdtp.adm.mvvm.ui.screen.project
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Card
+import androidx.compose.material.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
+import androidx.compose.ui.unit.sp
+import com.ys.bdtp.adm.R
+
+@Composable
+fun ProjectItem() {
+
+    Card(
+        modifier = Modifier
+            .width(570.dp)
+            .height(186.dp)
+            .border(
+                width = 0.5.dp,
+                color = Color(0xFFE5E5E5),
+                shape = RoundedCornerShape(0)
+            )
+            .background(Color.Transparent),
+        shape = RoundedCornerShape(0)
+    ) {
+        Row(
+            modifier = Modifier
+                .padding(start = 28.dp, top = 28.dp, bottom = 28.dp),
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+
+            Image(
+                painter = painterResource(R.drawable.project_item_placeholder),
+                contentDescription = "",
+                modifier = Modifier.width(130.dp).height(130.dp)
+            )
+
+            Spacer(modifier = Modifier.width(28.dp))
+
+            Column(
+                modifier = Modifier.fillMaxHeight(),
+                verticalArrangement = Arrangement.SpaceAround
+            ) {
+                Text(text = "京东科技大厦", color = Color(0xFF1F2429), fontSize = 20.sp)
+                Text(text = "项目ID:Ewq2123", color = Color(0xFF1F2429), fontSize = 16.sp)
+                Text(text = "项目角色:项目管理", color = Color(0xFF1F2429), fontSize = 16.sp)
+            }
+
+            Spacer(modifier = Modifier.width(28.dp))
+
+            Column(
+                modifier = Modifier.fillMaxHeight(),
+                verticalArrangement = Arrangement.SpaceAround
+            ) {
+                Text(text = "项目开始时间:?", color = Color(0xFF1F2429), fontSize = 16.sp)
+                Text(text = "项目完成时间:?", color = Color(0xFF1F2429), fontSize = 16.sp)
+            }
+        }
+    }
+}
+
+@Preview
+@Composable
+fun PreviewProjectItem() {
+    ProjectItem()
+}

+ 97 - 0
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/project/ProjectScreen.kt

@@ -0,0 +1,97 @@
+package com.ys.bdtp.adm.mvvm.ui.screen.project
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.GridCells
+import androidx.compose.foundation.lazy.LazyVerticalGrid
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.NotificationsNone
+import androidx.compose.material.icons.filled.PanoramaPhotosphere
+import androidx.compose.material.icons.filled.Person
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.IntSize
+import androidx.compose.ui.unit.dp
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+fun ProjectScreen() {
+    var size by remember { mutableStateOf(IntSize.Zero) }
+
+    Column(
+        modifier = Modifier.fillMaxSize()
+            .background(Color.DarkGray)
+    ) {
+
+        TopBar()
+
+        LazyVerticalGrid(
+            cells = GridCells.Fixed(2),
+            modifier = Modifier.fillMaxSize(),
+            contentPadding = PaddingValues(32.dp)
+        ) {
+
+            items(5) {
+                ProjectItem()
+            }
+        }
+    }
+
+}
+
+@Composable
+fun TopBar() {
+    Row(
+        modifier = Modifier
+            .fillMaxWidth()
+            .height(48.dp)
+            .background(Color(0xFFFFFFFF)),
+        horizontalArrangement = Arrangement.End
+    ) {
+        IconButton(onClick = {}) {
+            Icons.Default.PanoramaPhotosphere
+            Icon(
+                imageVector = Icons.Default.NotificationsNone,
+                contentDescription = "",
+                modifier = Modifier.size(24.dp),
+                tint = Color(0xFFC3C6CB)
+            )
+        }
+
+        IconButton(onClick = {}) {
+            Icons.Default.PanoramaPhotosphere
+            Icon(
+                imageVector = Icons.Default.Person,
+                contentDescription = "",
+                modifier = Modifier.size(24.dp),
+                tint = Color(0xFFC3C6CB)
+            )
+        }
+
+        Spacer(modifier = Modifier.width(16.dp))
+    }
+}
+
+@Preview
+@Composable
+fun PreviewProjectScreen() {
+    ProjectScreen()
+}

BIN
app/src/main/res/drawable-hdpi/login_background.png


BIN
app/src/main/res/drawable-hdpi/login_delete.png


BIN
app/src/main/res/drawable-hdpi/login_eye_close.png


BIN
app/src/main/res/drawable-hdpi/login_eye_open.png


BIN
app/src/main/res/drawable-hdpi/login_lock.png


BIN
app/src/main/res/drawable-hdpi/login_user.png


BIN
app/src/main/res/drawable-hdpi/logo.png


BIN
app/src/main/res/drawable-xhdpi/login_background.png


BIN
app/src/main/res/drawable-xhdpi/login_delete.png


BIN
app/src/main/res/drawable-xhdpi/login_eye_close.png


BIN
app/src/main/res/drawable-xhdpi/login_eye_open.png


BIN
app/src/main/res/drawable-xhdpi/login_lock.png


BIN
app/src/main/res/drawable-xhdpi/login_user.png


BIN
app/src/main/res/drawable-xhdpi/logo.png


BIN
app/src/main/res/drawable-xhdpi/project_item_placeholder.png


BIN
app/src/main/res/drawable-xxhdpi/icon_trailing_del.png


BIN
app/src/main/res/drawable-xxhdpi/icon_trailing_pwd_hide.png


BIN
app/src/main/res/drawable-xxhdpi/icon_trailing_pwd_show.png