- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有 3 个表面,如 gif 中所示,当我单击涟漪效应传播时没有考虑表面的形状。
哪些是用
@Composable
fun SurfaceClickPropagationExample() {
// Provides a Context that can be used by Android applications
val context = AmbientContext.current
// 🔥 Offset moves a component in x and y axes which can be either positive or negative
// 🔥🔥 When a component inside surface is offset from original position it gets clipped.
Box(
modifier = Modifier
.fillMaxWidth()
.wrapContentHeight()
.clipToBounds()
.clickable(onClick = {})
) {
Surface(
modifier = Modifier
.preferredSize(150.dp)
.padding(12.dp)
.clickable(onClick = {
})
.clipToBounds(),
elevation = 10.dp,
shape = RoundedCornerShape(10.dp),
color = (Color(0xFFFDD835))
) {
Surface(
modifier = Modifier
.preferredSize(80.dp)
.clipToBounds()
.offset(x = 50.dp, y = (-20).dp)
.clickable(onClick = {
}),
elevation = 12.dp,
shape = CircleShape,
color = (Color(0xFF26C6DA))
) {
}
}
Surface(
modifier = Modifier
.preferredSize(110.dp)
.padding(12.dp)
.offset(x = 110.dp, y = 20.dp)
.clickable(onClick = {}),
shape = CutCornerShape(10.dp),
color = (Color(0xFFF4511E)),
elevation = 8.dp
) {}
}
}
我添加了
Modifier.clipToBounds()
检查它是否适用于它,但无论有没有它都不起作用。
最佳答案
compose 版本 1.0.0-beta08 更新:
使用接受 onClick 的 Surface 的新实验性重载。
@ExperimentalMaterialApi
@Composable
fun Surface(
onClick: () -> Unit,
modifier: Modifier = Modifier,
shape: Shape = RectangleShape,
color: Color = MaterialTheme.colors.surface,
contentColor: Color = contentColorFor(color),
border: BorderStroke? = null,
elevation: Dp = 0.dp,
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
indication: Indication? = LocalIndication.current,
enabled: Boolean = true,
onClickLabel: String? = null,
role: Role? = null,
content: () -> Unit
): @ExperimentalMaterialApi @Composable Unit
文档:
https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#Surface(kotlin.Function0,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Shape,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.foundation.BorderStroke,androidx.compose.ui.unit.Dp,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.foundation.Indication,kotlin.Boolean,kotlin.String,androidx.compose.ui.semantics.Role,kotlin.Function0)
Modifier.clip(shape: Shape)
之前
Modifier.clickable
.
关于android - Jetpack Compose Surface 点击波纹没有根据形状剪裁?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65548150/
在this question的回答中, this fiddle进行“正常”裁剪,即灰色区域矩形外的图像将被裁剪,只保留灰色矩形区域内的图像。 “正常”裁剪的关键代码使用函数“clipTo”: obje
我一直在使用 JPanel,在提供的代码中名为 infoPanel,我希望能够在它前面精确地放置一个带有 JLabel 的 JTextField。我尝试向其中添加 JLabel,但无法将其放置在我想要
这可能没有我想象的那么难,但是我如何选择图像的一部分呢?考虑以下示例: 灰色区域是PNG或JPG格式的图片,现在我想从中选择红色的80x80像素区域。红色区域应显示,其余区域不显示。我尝试了很多方法:
http://www.youtube.com/watch?v=gZNdfVwkttM - 如果您看不到图片,您可以看到此视频中描述的所有问题。 下面所有图像中的所有墙壁都具有半透明的 PNG 纹理。每
我已经阅读了几个小时关于剪辑的文章,但我似乎没有找到解决我的问题的方法。 这是我的场景: 在 OpenGL ES 环境(IOS、Android)中,我有一个由可绘制对象组成的 2D 场景图,形成一棵树
问题是当我使用像 Helvetica Oblique 这样大小大于 13 的斜体字体时,UIButton 剪辑标题尾部(最后大约 1-2 个像素)。有人知道这个问题的解决方案吗? 最佳答案 子类 UI
想象一下,有一组光线围绕着一个圆圈 - 就像太阳一样。我想做的是遮盖光线,让光线看起来像是从太阳“升起”。 在 Flash 中,我可以通过执行类似以下步骤的操作为此创建一个不错的效果:- 将光线分成
我试图在背景图片上添加 CSS3 webkit 模糊,然后对其进行剪辑(通过将其放入较小的父级并设置 overflow: hidden ) 不幸的是,当我这样做时,我的模糊效果只发生在剪辑的内容上,所
如何让 div #1(页面标题)“切入”div #2(mainwrap)并查看背景图像? 例子: CSS: body {background-image: url("/background
我有一个相当数学的问题需要解决: 任务是用最少的废料从固定长度的管中切割出预定数量的管。 假设我想从标准长度为 6m 的 pipe 中切割出 10 根 1m 的 pipe 和 20 根 2.5m 的
我有一个巨大的image嵌入在 SVG 中的 map ,它比浏览器窗口大得多并位于屏幕中心。 有两条路。一条路径勾勒出一座建筑。另一条路径勾勒出 map 上的一个子区域。
我试图理解 E. L Foster 和 J. R. Overfelt [1] 的论文“Clipping of Arbitrary Polygons with Degeneracies”,该论文声称通过
我正在从一组点计算 voronoi 图,如下所示: from scipy.spatial import Voronoi import numpy as np np.random.seed(0) poi
我整天都在尝试解决这个问题,我将 mainWindow.xib 升级到了 4 英寸 iPhone 5 版本,并且我所有的 ActionSheets 在 4 英寸模拟器上都表现正常。但是,如果我取消在
我做了一个这样的面板框: HTML Hot Article Article Article Article
有什么方法可以防止 clip-path 剪掉它的 child 吗?例如,考虑以下代码: .el { width: 300px; height: 300px; clip-path: poly
我的应用程序使用 UINavigationController,但我没有显示工具栏,因为我的所有导航都由游戏内控件控制。 我没有标签栏,因为我没有使用 TabBarController。 我的游戏应用
场景: 在我的场景中,我实现了一个顶点着色器,它在相机位置的 xz 轴上定位一个平面网格。因此,如果相机移动,平面网格也会随之移动。这导致视觉效果,即在移动相机时,平面网格似乎保持固定在原地。这似乎工
我想替换列表中的大纲。因此我定义了一个上限和下限。现在,upper_bound 和 lower_bound 之下的每个值都替换为绑定(bind)值。我的方法是使用 numpy 数组分两步执行此操作。
我想在我的 Fabric-powered Canvas 中设置一个全局 clipTo,这将影响所有用户添加的图层。我想要一个不受此剪辑蒙版影响的背景图像和叠加图像。 例子: 这是这张照片中发生的事情:
我是一名优秀的程序员,十分优秀!