bai 3 лет назад
Родитель
Сommit
841b69b33c

+ 131 - 51
app/src/main/java/com/ys/bdtp/adm/mvvm/ui/screen/offline/OfflineHeadMiddle.kt

@@ -1,12 +1,20 @@
 package com.ys.bdtp.adm.mvvm.ui.screen.offline
 
+import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.layout.Box
+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.height
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Text
+import androidx.compose.material.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -18,67 +26,133 @@ import androidx.compose.ui.unit.sp
 import com.ys.bdtp.adm.R
 
 @Composable
-fun OfflineHeadMiddle() {
+fun OfflineHeadSyncMiddle() {
     Box(
         modifier = Modifier
             .width(300.dp)
             .height(52.dp)
     ) {
         Row(modifier = Modifier.align(Alignment.Center)) {
-            Box(modifier = Modifier
-                .width(139.dp)
-                .height(32.dp)
+            TextButton(
+                onClick = {},
+                modifier = Modifier
+                    .width(139.dp)
+                    .height(32.dp),
+                colors = ButtonDefaults.textButtonColors(
+                    backgroundColor = Color(0xFF0091FF),
+                    contentColor = Color.White
+                ),
+                shape = RoundedCornerShape(
+                    topStart = 4.dp,
+                    bottomStart = 4.dp,
+                    topEnd = 0.dp,
+                    bottomEnd = 0.dp
+                ),
+                contentPadding = PaddingValues()
+            ) {
+                Text(text = "全部同步")
+            }
+            Box {
+                TextButton(
+                    onClick = {},
+                    modifier = Modifier
+                        .width(140.dp)
+                        .height(32.dp),
+                    colors = ButtonDefaults
+                        .textButtonColors(
+                            backgroundColor = Color.White,
+                            contentColor = Color(0xFFD5D5D5)
+                        ),
+                    shape = RoundedCornerShape(
+                        topStart = 0.dp,
+                        bottomStart = 0.dp,
+                        topEnd = 4.dp,
+                        bottomEnd = 4.dp
+                    ),
+                    border = BorderStroke(width = 1.dp, color = Color(0xFFC3C7CB)),
+                    contentPadding = PaddingValues()
+                ) {
+                    Text(text = "停止同步", fontSize = 14.sp)
+                }
+                Spacer(modifier = Modifier.width(1.dp).height(32.dp).background(Color(0xFF0091FF)))
+            }
+        }
+
+        Box(
+            modifier = Modifier
+                .width(18.dp)
+                .height(18.dp),
+            contentAlignment = Alignment.Center
+        ) {
+            Image(
+                painter = painterResource(R.drawable.red_circle),
+                contentDescription = "",
+                modifier = Modifier.fillMaxSize()
+            )
+            Text(text = "3", color = Color.White, fontSize = 12.sp)
+        }
+    }
+}
+
+@Composable
+fun OfflineHeadSyncingMiddle() {
+    Box(
+        modifier = Modifier
+            .width(300.dp)
+            .height(52.dp)
+    ) {
+        Row(
+            modifier = Modifier
+                .align(Alignment.Center)
                 .background(
-                    Color(0xFF0091FF),
+                    color = Color.White, shape = RoundedCornerShape(
+                        topStart = 4.dp,
+                        bottomStart = 4.dp,
+                        topEnd = 4.dp,
+                        bottomEnd = 4.dp
+                    )
+                )
+                .border(
+                    width = 1.dp,
+                    color = Color(0xFFC3C7CB),
                     shape = RoundedCornerShape(
                         topStart = 4.dp,
                         bottomStart = 4.dp,
-                        topEnd = 0.dp,
-                        bottomEnd = 0.dp
+                        topEnd = 4.dp,
+                        bottomEnd = 4.dp
                     )
                 )
-                .clickable {}
+        ) {
+            TextButton(
+                onClick = {},
+                modifier = Modifier
+                    .width(139.dp)
+                    .height(32.dp),
+                colors = ButtonDefaults
+                    .textButtonColors(
+                        backgroundColor = Color.White,
+                        contentColor = Color(0xFF1F2429)
+                    ),
+                contentPadding = PaddingValues()
             ) {
-                Text(
-                    text = "全部同步",
-                    color = Color.White,
-                    fontSize = 14.sp,
-                    modifier = Modifier.align(Alignment.Center)
-                )
+                Text(text = "数据下载同步中", fontSize = 14.sp)
             }
-            Box {
-                Box(modifier = Modifier
-                    .width(140.dp)
-                    .height(32.dp)
-                    .background(
-                        Color(0xFFFFFFFF),
-                        shape = RoundedCornerShape(
-                            topStart = 0.dp,
-                            bottomStart = 0.dp,
-                            topEnd = 4.dp,
-                            bottomEnd = 4.dp
-                        )
-                    )
-                    .border(
-                        width = 1.dp,
-                        color = Color.Gray,
-                        shape = RoundedCornerShape(
-                            topStart = 0.dp,
-                            bottomStart = 0.dp,
-                            topEnd = 4.dp,
-                            bottomEnd = 4.dp
-                        )
-                    )
-                    .clickable {}
-                ) {
-                    Text(
-                        text = "停止同步",
-                        color = Color(0xFFD5D5D5),
-                        fontSize = 14.sp,
-                        modifier = Modifier.align(Alignment.Center)
-                    )
-                }
-                Spacer(modifier = Modifier.width(1.dp).height(32.dp).background(Color(0xFF0091FF)))
+
+            Spacer(modifier = Modifier.width(1.dp).height(32.dp).background(Color(0xFFC3C7CB)))
+
+            TextButton(
+                onClick = {},
+                modifier = Modifier
+                    .width(139.dp)
+                    .height(32.dp),
+                colors = ButtonDefaults
+                    .textButtonColors(
+                        backgroundColor = Color.White,
+                        contentColor = Color(0xFFD5D5D5)
+                    ),
+                contentPadding = PaddingValues()
+            ) {
+                Text(text = "停止同步", fontSize = 14.sp)
             }
         }
 
@@ -95,7 +169,6 @@ fun OfflineHeadMiddle() {
             )
             Text(text = "3", color = Color.White, fontSize = 12.sp)
         }
-
     }
 }
 
@@ -103,5 +176,12 @@ fun OfflineHeadMiddle() {
 @Preview
 @Composable
 fun PreviewOfflineHeadMiddle() {
-    OfflineHeadMiddle()
+    OfflineHeadSyncMiddle()
+}
+
+
+@Preview
+@Composable
+fun PreviewOfflineHeadSyncingMiddle() {
+    OfflineHeadSyncingMiddle()
 }