Skip to content

Commit fd7c238

Browse files
guozhiqiang123guozhiqiang123
committed
美化首页UI
1 parent 45420f5 commit fd7c238

File tree

11 files changed

+263
-36
lines changed

11 files changed

+263
-36
lines changed

‎.idea/inspectionProfiles/Project_Default.xml

+9
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/build.gradle

+1
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ dependencies {
8989
implementation 'androidx.webkit:webkit:1.5.0'
9090
implementation "androidx.lifecycle:lifecycle-livedata-ktx:$androidx_lifecycle"
9191
implementation "androidx.compose.ui:ui-util:$compose_version"
92+
implementation "androidx.constraintlayout:constraintlayout-compose:1.0.1"
9293

9394
//retrofit
9495
//https://github.com/square/retrofit

‎app/src/main/assets/markdown/ToDo.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -12,4 +12,5 @@
1212
- [ ] 代码注释补充1.0
1313
- [x] 新增阅读历史功能（只做本地存储，演示room使用）
1414
- [ ] 解决网页返回上一个页面是blank的问题
15-
- [ ] 解决Compose点击事件不能穿透的问题
15+
- [ ] 解决使用Modifier.verticalScroll()导致点击事件不能向下传递
16+
- [ ] 按钮防重复点击

‎app/src/main/java/com/gzq/wanandroid/features/home/home/HomeMainPage.kt

+15-16
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
11
package com.gzq.wanandroid.features.home.home
22

33
import androidx.compose.animation.ExperimentalAnimationApi
4+
import androidx.compose.foundation.background
5+
import androidx.compose.foundation.clickable
46
import androidx.compose.foundation.isSystemInDarkTheme
57
import androidx.compose.foundation.layout.Arrangement
68
import androidx.compose.foundation.layout.Column
79
import androidx.compose.foundation.layout.fillMaxSize
810
import androidx.compose.foundation.layout.fillMaxWidth
911
import androidx.compose.foundation.layout.padding
1012
import androidx.compose.foundation.lazy.itemsIndexed
13+
import androidx.compose.foundation.shape.RoundedCornerShape
1114
import androidx.compose.material.ScrollableTabRow
1215
import androidx.compose.material.Surface
1316
import androidx.compose.material.Tab
@@ -19,6 +22,7 @@ import androidx.compose.runtime.Composable
1922
import androidx.compose.runtime.getValue
2023
import androidx.compose.runtime.livedata.observeAsState
2124
import androidx.compose.ui.Modifier
25+
import androidx.compose.ui.draw.clip
2226
import androidx.compose.ui.unit.dp
2327
import androidx.lifecycle.viewmodel.compose.viewModel
2428
import androidx.navigation.NavGraphBuilder
@@ -30,6 +34,7 @@ import com.gzq.wanandroid.exit_app.MyBackHandler
3034
import com.gzq.wanandroid.features.home.home.components.HomeListItemC
3135
import com.gzq.wanandroid.model.Article
3236
import com.gzq.wanandroid.router.Router
37+
import com.gzq.wanandroid.ui.common.ArticleListItemC
3338
import com.gzq.wanandroid.widget.PageHolder
3439
import com.gzq.wanandroid.widget.RefreshLoadMoreLazyColum
3540
import com.gzq.wanandroid.widget.RefreshLoadMoreState
@@ -108,7 +113,7 @@ fun HomeMainPage(
108113
RefreshLoadMoreLazyColum(
109114
modifier = Modifier.fillMaxSize(),
110115
state = refreshLoadMoreState,
111-
verticalArrangement = Arrangement.spacedBy(16.dp),
116+
verticalArrangement = Arrangement.spacedBy(12.dp),
112117
onRefreshCallBack = {
113118
viewModel.fetchHomeList(isRefresh = true, tabName = tabs[selectTab])
114119
},
@@ -119,24 +124,18 @@ fun HomeMainPage(
119124
)
120125
},
121126
) {
122-
/**
123-
* 支持从左到右滑动删除
124-
*/
125127
itemsIndexed(
126128
items = data ?: emptyList(),
127129
) { index, item ->
128-
HomeListItemC(
129-
modifier = Modifier
130-
.padding(
131-
top = if (index == 0) 12.dp else 0.dp,
132-
start = 16.dp,
133-
end = 16.dp
134-
)
135-
.fillMaxWidth(),
136-
data = item
137-
) {
138-
launchToDetailPage?.invoke(item)
139-
}
130+
ArticleListItemC(
131+
article = item,
132+
Modifier
133+
.fillMaxWidth()
134+
.padding(horizontal = 16.dp)
135+
.clickable {
136+
launchToDetailPage?.invoke(item)
137+
}
138+
)
140139
}
141140
}
142141
}

‎app/src/main/java/com/gzq/wanandroid/features/home/profile/ProfileMainPage.kt

+1-8
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
11
package com.gzq.wanandroid.features.home.profile
22

3-
import android.widget.Toast
43
import androidx.annotation.StringRes
54
import androidx.compose.animation.ExperimentalAnimationApi
65
import androidx.compose.foundation.ScrollState
76
import androidx.compose.foundation.background
87
import androidx.compose.foundation.clickable
9-
import androidx.compose.foundation.combinedClickable
108
import androidx.compose.foundation.interaction.MutableInteractionSource
119
import androidx.compose.foundation.layout.Arrangement
1210
import androidx.compose.foundation.layout.Box
@@ -26,10 +24,8 @@ import androidx.compose.foundation.verticalScroll
2624
import androidx.compose.material.Surface
2725
import androidx.compose.material.icons.Icons
2826
import androidx.compose.material.icons.filled.Notifications
29-
import androidx.compose.material3.Button
3027
import androidx.compose.material3.Card
3128
import androidx.compose.material3.CardDefaults
32-
import androidx.compose.material3.ExperimentalMaterial3Api
3329
import androidx.compose.material3.Icon
3430
import androidx.compose.material3.IconButton
3531
import androidx.compose.material3.MaterialTheme
@@ -46,8 +42,6 @@ import androidx.compose.runtime.setValue
4642
import androidx.compose.ui.Alignment
4743
import androidx.compose.ui.Modifier
4844
import androidx.compose.ui.graphics.Brush
49-
import androidx.compose.ui.graphics.Color
50-
import androidx.compose.ui.platform.LocalContext
5145
import androidx.compose.ui.res.stringResource
5246
import androidx.compose.ui.text.font.FontWeight
5347
import androidx.compose.ui.text.style.TextOverflow
@@ -59,7 +53,6 @@ import androidx.navigation.NavHostController
5953
import com.google.accompanist.navigation.animation.composable
6054
import com.gzq.wanandroid.HttpUrl
6155
import com.gzq.wanandroid.R
62-
import com.gzq.wanandroid.core.quality.LogCompositions
6356
import com.gzq.wanandroid.exit_app.MyBackHandler
6457
import com.gzq.wanandroid.features.home.profile.components.LoginWarningDialogC
6558
import com.gzq.wanandroid.features.home.profile.components.LogoutDialogC
@@ -69,7 +62,7 @@ import com.gzq.wanandroid.features.home.profile.components.ProfileUserNameC
6962
import com.gzq.wanandroid.features.main.LocalLoginState
7063
import com.gzq.wanandroid.features.open_source_libs.MarkdownPreviewPageArgs
7164
import com.gzq.wanandroid.router.Router
72-
import com.gzq.wanandroid.widget.OnDevelopingDialogC
65+
import com.gzq.wanandroid.ui.common.OnDevelopingDialogC
7366
import kotlinx.coroutines.launch
7467

7568

‎app/src/main/java/com/gzq/wanandroid/features/home/project/ProjectMainPage.kt

+18-7
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,11 @@ fun NavGraphBuilder.projectMainPage(
2929
navController.navigate(Router.CoilImagePage.route)
3030
}, routeSketchImagePage = {
3131
navController.navigate(Router.SketchImagePage.route)
32-
}) {
32+
}, routeFreeStylePage = {
3333
navController.navigate(Router.FreeStylePage.route)
34-
}
34+
}, routeTestClickPage = {
35+
navController.navigate(Router.TestClickPage.route)
36+
})
3537
}
3638
}
3739

@@ -41,7 +43,8 @@ fun ProjectMainPage(
4143
routeGlideImagePage: () -> Unit,
4244
routeCoilImagePage: () -> Unit,
4345
routeSketchImagePage: () -> Unit,
44-
routeFreeStylePage: () -> Unit
46+
routeFreeStylePage: () -> Unit,
47+
routeTestClickPage: () -> Unit,
4548
) {
4649
MyBackHandler()
4750
LazyColumn(
@@ -51,35 +54,43 @@ fun ProjectMainPage(
5154
) {
5255
item {
5356
Button(
54-
onClick = routeGlideImagePage ?: {},
57+
onClick = routeGlideImagePage,
5558
Modifier.fillMaxWidth()
5659
) {
5760
Text(text = stringResource(id = R.string.glide_load_image))
5861
}
5962
}
6063
item {
6164
Button(
62-
onClick = routeCoilImagePage ?: {},
65+
onClick = routeCoilImagePage,
6366
Modifier.fillMaxWidth()
6467
) {
6568
Text(text = stringResource(id = R.string.coil_load_image))
6669
}
6770
}
6871
item {
6972
Button(
70-
onClick = routeSketchImagePage ?: {},
73+
onClick = routeSketchImagePage,
7174
Modifier.fillMaxWidth()
7275
) {
7376
Text(text = stringResource(id = R.string.sketch_load_image))
7477
}
7578
}
7679
item {
7780
Button(
78-
onClick = routeFreeStylePage ?: {},
81+
onClick = routeFreeStylePage,
7982
Modifier.fillMaxWidth()
8083
) {
8184
Text(text = stringResource(id = R.string.free_style_projects))
8285
}
8386
}
87+
item {
88+
Button(
89+
onClick = routeTestClickPage,
90+
Modifier.fillMaxWidth()
91+
) {
92+
Text(text = "验证点击事件穿透")
93+
}
94+
}
8495
}
8596
}

‎app/src/main/java/com/gzq/wanandroid/features/test_click/TestClickPage.kt

+106
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
package com.gzq.wanandroid.features.test_click
2+
3+
import android.widget.Toast
4+
import androidx.compose.animation.ExperimentalAnimationApi
5+
import androidx.compose.foundation.background
6+
import androidx.compose.foundation.gestures.Orientation
7+
import androidx.compose.foundation.gestures.draggable
8+
import androidx.compose.foundation.gestures.rememberDraggableState
9+
import androidx.compose.foundation.layout.Box
10+
import androidx.compose.foundation.layout.Column
11+
import androidx.compose.foundation.layout.Spacer
12+
import androidx.compose.foundation.layout.fillMaxSize
13+
import androidx.compose.foundation.layout.fillMaxWidth
14+
import androidx.compose.foundation.layout.height
15+
import androidx.compose.foundation.layout.offset
16+
import androidx.compose.foundation.layout.padding
17+
import androidx.compose.foundation.rememberScrollState
18+
import androidx.compose.foundation.verticalScroll
19+
import androidx.compose.material3.Button
20+
import androidx.compose.material3.ExperimentalMaterial3Api
21+
import androidx.compose.material3.Scaffold
22+
import androidx.compose.material3.Text
23+
import androidx.compose.runtime.Composable
24+
import androidx.compose.runtime.getValue
25+
import androidx.compose.runtime.key
26+
import androidx.compose.runtime.mutableStateOf
27+
import androidx.compose.runtime.remember
28+
import androidx.compose.runtime.setValue
29+
import androidx.compose.ui.Modifier
30+
import androidx.compose.ui.graphics.Color
31+
import androidx.compose.ui.platform.LocalContext
32+
import androidx.compose.ui.unit.IntOffset
33+
import androidx.compose.ui.unit.dp
34+
import androidx.navigation.NavGraphBuilder
35+
import androidx.navigation.NavHostController
36+
import com.google.accompanist.navigation.animation.composable
37+
import com.gzq.wanandroid.router.Router
38+
import com.gzq.wanandroid.widget.MyTopAppBar
39+
import kotlin.math.roundToInt
40+
41+
@OptIn(ExperimentalAnimationApi::class)
42+
fun NavGraphBuilder.testClickPage(
43+
navController: NavHostController
44+
) {
45+
composable(Router.TestClickPage.route) {
46+
TestClickPage(){
47+
48+
}
49+
}
50+
}
51+
52+
@OptIn(ExperimentalMaterial3Api::class)
53+
@Composable
54+
fun TestClickPage(clickBack: () -> Unit) {
55+
Scaffold(topBar = {
56+
MyTopAppBar(title = "测试点击穿透", clickBack = clickBack)
57+
}) { paddingValues ->
58+
val ctx = LocalContext.current
59+
Box(
60+
Modifier
61+
.padding(paddingValues)
62+
.fillMaxSize()
63+
) {
64+
Button(onClick = {
65+
Toast.makeText(ctx, "点击生效", Toast.LENGTH_SHORT).show()
66+
}) {
67+
Text(text = "点击我")
68+
}
69+
70+
Column(
71+
Modifier
72+
.fillMaxSize()
73+
.verticalScroll(rememberScrollState())
74+
) {
75+
76+
}
77+
}
78+
}
79+
}
80+
81+
@Composable
82+
fun ClickEventTest() {
83+
val ctx = LocalContext.current
84+
var offset by remember {
85+
mutableStateOf(0f)
86+
}
87+
Box(Modifier.fillMaxSize()) {
88+
Button(
89+
onClick = { Toast.makeText(ctx, "我是Toast", Toast.LENGTH_SHORT).show() },
90+
) {
91+
Text(text = "点我")
92+
}
93+
Column(
94+
Modifier
95+
.fillMaxSize()
96+
.offset { IntOffset(0, offset.roundToInt()) }
97+
.draggable(rememberDraggableState(onDelta = { offset += it}), Orientation.Vertical)
98+
) {
99+
repeat(20){ i->
100+
key(i) {
101+
Text(text = "Item $i", modifier = Modifier.padding(20.dp))
102+
}
103+
}
104+
}
105+
}
106+
}

‎app/src/main/java/com/gzq/wanandroid/router/Router.kt

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
11
package com.gzq.wanandroid.router
22

3-
import com.gzq.wanandroid.features.open_source_libs.MarkdownPreviewPageArgs
4-
import com.gzq.wanandroid.model.Article
5-
63
/**
74
* 如果需要传参，请参照DetailPage，单独提供方法，统一传参，方便维护
85
*/
@@ -35,4 +32,5 @@ sealed class Router(val route: String) {
3532
}
3633

3734
object CollectionPage : Router("collection")
35+
object TestClickPage : Router("test/click")
3836
}

‎app/src/main/java/com/gzq/wanandroid/router/RouterRegister.kt

+3
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import com.gzq.wanandroid.features.home.project.projectMainPage
2626
import com.gzq.wanandroid.features.login.loginPage
2727
import com.gzq.wanandroid.features.open_source_libs.openSourceLibsPage
2828
import com.gzq.wanandroid.features.register.registerPage
29+
import com.gzq.wanandroid.features.test_click.testClickPage
2930
import com.gzq.wanandroid.features.webview.webviewPage
3031

3132
@OptIn(ExperimentalAnimationApi::class)
@@ -95,6 +96,8 @@ fun RouterRegister(
9596
webviewPage(navController,showBottomNavigationBar)
9697

9798
collectionPage(navController,showBottomNavigationBar)
99+
100+
testClickPage(navController)
98101
}
99102
}
100103

0 commit comments

Comments
 (0)