首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    手把手教你实现Android开发中的3D卡片翻转效果!

    ---- --正文-- 《Android自定义控件高级进阶与精彩实例》一书中有一个使用Camera类(书中有对该类的详细讲解)实现3D卡片翻转效果的例子(效果如下所示)。...从效果图可以看到,这样就初步实现了开始时的效果,但还是有所不同,开始时的效果在旋转至90°后,显示的是另一张图像,这是怎么做到的呢? 03 正背面显示不同的内容 回顾一下开始时的动画,效果如下。...这样处理后,就实现了我们想要的效果。 方案二:使用多控件显示/隐藏实现 方案一只能解决同一个控件中显示不同内容的问题,但若要正背面显示不同的控件,就没办法了。...这时可以使用方案二,即在布局中引入两个ImageView控件,用从0°旋转至90°时显示一个控件而从90°旋转至180°时显示另一个控件的方式来实现。...本书主要内容有3D特效的实现、高级矩阵知识、消息处理机制、派生类型的选择方法、多点触控及辅助类、RecyclerView的使用方法及3D卡片的实现、动画框架Lottie的讲解与实战等。

    2.5K11

    2018年3大UI设计趋势,你知道吗?

    在这篇文章中,小编将分享三个最新的UI设计趋势,这也是我们团队计划在2018年在进行设计iOS和Android应用时要遵循的最新UI趋势。 1....色彩鲜艳的调色板和无边框显示 大多数人早已经习惯了扁平化UI设计趋势的流行,以简约的方式呈现元素和柔和的色彩。...2.jpg 除了在设计中使用鲜艳的颜色之外,为了最大程度地吸引用户关注度,设计师将不得不把目光转向无边框显示,即连续性故事式展示。...在其他新的UI设计趋势中,苹果已经在iPhone X中实现了这一趋势。为了创建良好的品牌体验,他们在无边框显示中使用高质量的图片,以重新定义移动设计严格的网格设计概念。...甚至连Google这样的巨头也开始在卡片上显示个人搜索结果。据专业人士预测,在2018年的UI设计中,卡片的使用几率会越来越大,尤其是在智能手机软件和移动应用上。

    87550

    Material Design —卡片(Cards)

    支持的手势 滑动(swipe) 拾取并移动(Pick-up-and-move) 相关组件 网格列表(Grid lists) 对于开发者 Android卡片 聚合卡片(Polymer cards) ---...左:不同内容与布局的卡片集合    右:不同布局与不同内容层次的卡片集合 ---- 行为 卡片具有恒定的宽度和可变的高度。最大高度限于平台上可用空间的高度,但可以暂时扩大(例如,显示评论)。...卡片不会翻转以显示背面的信息。 支持的手势 卡片手势应始终在卡片集合中实施。 支持的手势包括: 滑动手势(swipe gesture)可以在每张卡片上使用。限制视图内的轻扫手势,使其不会彼此重叠。...超过最大卡片高度的卡片内容会被省略,内部不会滚动,但可以扩展卡片。 一旦展开,卡片可能会超过视图的最大高度。 在这种情况下,卡片将随卡片集合一起滚动。 ? ?...对于依赖焦点遍历进行导航(手柄和键盘)的页面,卡片应具有主要操作或打开包含主要和补充操作的新视图。 ? 选择操作 ?

    4.3K100

    Android性能优化:过渡绘制解决方案

    下图中多个卡片跌在一起,但是只有第一个卡片是完全可见的。背后的卡片只有部分可见。但是Android系统在绘制时会将下层的卡片进行绘制,接着再将上层的卡片进行绘制。...但其实,下层卡片不可见的部分是不需要进行绘制的,只有可见部分才需要进行绘制。 ?...点开后后选择『显示过渡绘制区域』: ?...在开发中,很多时候需要显示图片,在图片加载出来之前通常是需要显示一张默认图片的,很多时候会使用ImageView的background属性来设置默认背景图,而imageDrawable来设置需要加载的图片...总结 Android中一个window对应一个Canvas,window下的所有视图(View/ViewGroup)使用的都是同一个canvas,视图树的父节点在调用子视图的View.draw之前,会对

    2.3K10

    Power BI卡片图添加地图

    《新卡片图五大应用场景》 《新卡片图异形边框》 《新卡片图主次指标组合》 《新卡片图总分结构》 ---- Power BI 2023年6月推出的卡片图视觉对象是一个良好的地图载体。...在卡片图添加地图,本质上就是添加图标,以下卡片图中,地图的添加方式和销售业绩、业绩达成率的图标没什么不同。...此时的地图为原始文件,只能依据城市切片,切换样式,无法改变颜色。分析地图的源代码,有stroke字样表示边框颜色,fill字样表示填充色,借助DAX,可以将这两者动态化。...SVG.地图显示边框颜色 = VAR Color = IF([业绩达成率]>=1,"green","red") RETURN SUBSTITUTE([SVG.地图显示基础版],"black",Color...以下是本文列示的全家福,卡片图的地图应用远不止这些,后续还会介绍。 ----

    35210

    Power BI新卡片图穿墙术

    《Power BI表格矩阵穿墙术》介绍了如何实现表格矩阵的格子穿透,构建丰富的可视化效果。新卡片图视觉对象(不了解新卡片图参考此文:Power BI可视化的巅峰之作:新卡片图)能否实现同样的功能?...答案是肯定的。 新卡片图任意放入两个指标,生成两个卡片,可以看到卡片中间有明显的缝隙。 在布局-卡片间距将像素设置为0,可以看到缝隙消失,两个边框合并为一。...目前为止,两个卡片的内容仍然独立显示,没有穿透的感觉。我们在卡片放入一条直线,以便观察连接效果: 把上方SVG横线放入卡片图图像URL,两个线条断开明显。...假设只想显示横线,不需要数据,是否可行,答案是不行。 标签可以隐藏,但是值如果关闭,线条又会断开,所以一个变通的处理方式是,把值的文本大小调低,并且透明度调整为100%,达到隐藏目的。...边框是否阻止了横线的连接?并没有。把边框加粗可以看到横线直接穿过边框,如果视觉上有少许缝隙,可以借助stroke-dasharray将线条虚线化进行掩盖。 横向可以穿透,纵向是否可行?

    25520

    实践 | Google IO 应用是如何适配大尺寸屏幕 UI 的?

    在程序运行过程中,我们可以通过 Kotlin 的安全调用操作符 (?.) 来根据当前的设备配置确定呈现给用户哪一个视图。...在宽尺寸屏幕上,这些列表项会转换为一格一格的卡片,卡片上直接显示了详细的内容。 △ 左图: 窄屏幕显示 Codelabs。右图: 宽屏幕显示 Codelabs。...这些独立的网格卡片是定义在 res/layout-w840dp 下的 备用布局,数据绑定处理信息如何与视图绑定,以及卡片如何响应点击,所以除了不同样式下的差异之外,不需要实现太多内容。...将 RecyclerView 自身的内边距也设置为相同的值,会使得元素同 RecyclerView 边界的距离与元素间的空隙保持相同的大小,在元素周围形成统一的留白。...为了让元素能够一直滚动显示到 RecyclerView 的边缘,需要设置 android:clipToPadding="false"。 屏幕越多样越好 Android 一直是个多样化的硬件生态系统。

    2.1K20

    微商城订单模块重构实践

    为了在新订单列表重构的过程中,尽可能的规避掉旧订单列表中相关的坑点,Android 侧将订单列表页面从不同的维度进行了拆分: 1.从 UI 层面 新的订单列表将订单状态选择器、订单类型选择面板、订单卡片分别拆分成了不同的视图...与此同时,将订单卡片中各个子内容封装为控件,以便于卡片视图内部对各个子组件来对订单视图进行组合,来支持多种样式的订单卡片。...1.2 路由切换 解决的问题:iOS(组件间切换),Android(组件、页面间切换)。...在新的订单列表中: 在新的订单列表中,Android 侧的订单列表将对应的卡片的点击操作处理交给了订单卡片中对应的子组件进行处理,业务方添加订单卡片操作处理时只需要关注对应组件即可。...这样做的好处: 拆分职责,避免臃肿复杂的模型、视图的产生 容易扩展,后续如有新功能区域,只需继续堆叠视图、模型即可 每部分均为独立组件,不同的订单样式上的差异展示只需要对对应的组件做设置控制样式,进行显示隐藏即可适配不同订单类型状态

    1.8K30

    GUI组件添加、布局设置

    注意:使用这个对象时,传递的数字越大,字体越大,数字越小,字体越小 窗口显示在最上面:   setAlwaysOnTop();方法,写true就是令窗口显示 最上面,false则反之: ?...显示效果: ? 设置之后窗口就会一直在其他窗口的上面显示 去除窗口边框:   setUndecorated();方法,写true就是除去窗口的边框, false则反之: ? 运行效果: ?...显示出来就是没有边框的窗口 使窗口不能伸缩:   setResizable();方法,写false就是令窗口不能伸缩, 将尺寸定死,true则反之: ? 运行效果: ?...流式布局里的组件会随着窗口的拉动而改变 卡片布局:   CardLayout是卡片布局对象,可以直接在setLayout();方法里new这个卡片布局对象,就可以实现流式布局了:  ?...卡片布局就是像卡片一样,一张张的卡片叠在一起,按下一步就会到下一个卡片界面

    1.2K20

    Power BI 模拟知乎风格卡片图

    知乎每周会给创作者发送上周的创作及访问数据,如下图所示。这个报告的一大亮点在于,卡片图是圆形背景,Power BI如何模拟?...有些读者可能想到视觉对象边框可以设置圆角,圆角大到一定程度,矩形就会变成圆形,但这里有个问题,Power BI目前只支持圆角为30像素,最大只能下图显示的弧度。 所以第一次尝试失败。...如果仍然不想放弃内置卡片图,只能叠图,在插入形状选项卡下可以看到有圆形造型。 把插入的圆形填充色设置为知乎蓝,同时去掉边框。 接着圆形和内置卡片图堆到一起,并置于底层,即可实现圆形卡片图效果。...按钮的形状设置为圆角矩形,这里大家可以看到,不同于卡片图,圆角的弧度可以更大,50%意味着矩形变为圆形。...如果你的卡片图需要显示在表格或者矩阵,以上两种方式就做不到了,需要使用SVG矢量图的方式实现,效果如下。实现过程可以参考前期的《Power BI原生矩阵气泡图》 ----

    1.1K21

    Power BI卡片图指标与排名组合

    本文是Power BI新卡片图系列第11篇分享,前10篇如下: 《Power BI巅峰之作:新卡片图》 《卡片图添加异形边框》 《卡片图主次指标组合》 《卡片图总分结构》 《卡片图添加地图》...2023年6月推出的卡片图可以实现类似的组合(不了解新卡片图可查看此文:Power BI可视化的巅峰之作:新卡片图),例如,指标右上角放一个排名卡片,绿色表示前三名,红色表示排名靠后: 实现的方式是卡片图插入...排名也可以放到上方,以下看上去是一种神奇的效果,排名在边框之上。 如果使用卡片图的默认边框,是无法产生这种效果的,此处实际做了一个假边框,下图外层是真实边框,内层为假边框。...假边框是我们填充了一个卡片背景图,填充方式参考此文《Power BI卡片图异形边框》。填充完成后关闭真边框,并把排名图像至于上方。...还有一种更神奇的效果,排名图标在边框角落,而不是上下左右,读者可以思考下如何实现。

    39310

    无框界面

    去形式样例 那么卡片化呢? 如果你的设计思维还停留在卡片话,那就落伍了,因为无框界面的趋势下,卡片的概念被淡化。卡片与否有何重要?...几年前大家注意到显示屏的尺寸越来越不可预期,设计师急需一种设计手段,来让设计出的界面能够适应不同尺寸的屏幕。...卡片刚好能够解决这一点,因为它将内容封装成固定的小区块,像水一样,可以放在任何比自己大的容器中。不但如此,卡片式界面还可以根据需要岁时删减卡片,以此灵活控制界面上的内容种类和数量。...由此响应式界面的大环境下,卡片化这个词被越来越多地注意到。 其实无框界面与卡片化并不真正相冲,将内容分装成小区块的概念依旧还在,只是此时卡片已经完全透明,不需要看到卡片的样子了。 无框的优势?...如果界面上摆放了过多色彩显明、吸引注意力的“装饰”,用户看到内容的几率变下降了。当然,即便有边框,还是能够通过对边框的特殊设计来控制用户的注意力不分散,但是边框越多,难度就越大。

    1.3K60

    Power BI 动画之放大缩小

    《Power BI 异常指标闪烁提示》《Power BI异常指标闪烁提示(2)》《Power BI异常指标闪烁提示(3)》三篇文章从三个不同的角度介绍了闪烁动画在Power BI的应用,有读者可能会觉得闪烁看时间长了眼花...,本文介绍另外一种温和的动画:放大缩小。...path { animation: wujunmin 1s infinite; transform-origin: center; } 以下是配套的内置了...Power BI迄今为止最强大的三大视觉对象之一(另外两个是表格和矩阵) 《新卡片图介绍》 《卡片图添加异形边框》 《卡片图主次指标组合》 《卡片图总分结构》 《卡片图添加地图》 《卡片图添加下划线...《卡片图显示不同单位》 《卡片图显示动态水印》 《卡片图使用像素风格图标》 《卡片图LED风格数字》 《卡片图仪表盘富婆图表版》 《卡片图仪表盘EasyShu版》 《卡片图穿墙术》

    29510

    Android5.0 新特性

    支持64位虚拟机 放弃了之前使用的Dalivk虚拟机,改用了Art虚拟机,实现真正的跨平台编译,在不同的机器平台上出现 多任务窗口OverView 每个App都是一个独立的卡片 设备识别解锁 当特定设备在...Android设备附近时,绕过锁屏界面直接解锁 RecylerView出现替代ListView RecylerView具有高度的解耦,异常的灵活性和更高的效率,可支持设置不同的布局管理器LayoutManager...,条目间隔线ItemDecoration,ItemAnimator实现不同的效果 CardView卡片布局出现 可设置卡片的圆角半径,阴影半径 三种通知 普通通知 折叠通知 在普通通知的基础上加入了自定义布局通过设置...builder的bigContentView属性 由于布局是在App进程中,而通知明显不是App进程因此需要使用RemoteView封装自定义视图 悬浮通知 当该通知出现时会在屏幕上悬浮一段时间后自动消失...相比ActonBar,ToolBar更自由更有设置的空间,随处放置 使用方法和ActionBar一样 需要在style中设置将ActionBar去除,并且在代码中显示调用setSupportActionBar

    65030
    领券