问题标签 [material-design]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
927 浏览

dart - 选择更改后,纸张单选按钮波纹仍然存在

给定一个纸质无线电组,如下所示

当男性按钮被选中,然后是女性按钮时,反之亦然,即使选择发生变化,波纹也会不一致地保留在最后一个选定的按钮上。它以不可预测的方式发生,没有堆栈跟踪。

在此处输入图像描述

在上图中,先选择了女性,然后选择了男性。

我正在使用 Polymer-dart 0.12.0-dev 和 Dart Editor 版本 1.6.0.dev_03_00 (DEV) Dart SDK 版本 1.6.0-dev.3.0

0 投票
1 回答
536 浏览

html - CSS中的分层定时动画?

谷歌设计文档指南展示了这个伟大的转变(视频)

动画进行中

如何在纯 CSS3 中重新创建它?

0 投票
2 回答
1109 浏览

shadow - 聚合物材料设计纸影触摸

我正在使用 Google 的Material DesignPolymer-Project在一个网站上工作。

根据 Google 的Surface Response 动画指南,例如,当点击一个对象时,应该将其提升一段时间,以及涟漪效应。阅读Paper-shadow 文档,我发现animated可以将参数设置为 true 以动画化元素的 z 值(深度)的变化。

但是,如何将其更改回初始值?我可以设置一个计时器并重新应用初始值,但这似乎不是解决此问题的有效方法。由于建议行为添加此功能,我认为它应该以某种方式实现(或者它可能正在路上?)

有谁知道如何解决这个问题?这是当前代码:

0 投票
1 回答
1854 浏览

javascript - 在 Designer 中使用 Polymer 中的核心动画页面

我正在尝试使用 Designer 来解决问题。我正在尝试在 2 个核心动画页面部分之间创建一个简单的面部过渡,但我不确定我哪里出错了。我正在使用的代码如下。您可以简单地将整个代码粘贴到 Designer ( http://www.polymer-project.org/tools/designer/ ) 中的代码视图中。我只想让白色的小方块消失并出现一个更大的白色方块。

你能帮我吗?

0 投票
2 回答
1979 浏览

polymer - 材料设计选择框聚合物

我注意到 Polymer 文档的 Paper Elements 部分中没有“选择框”小部件,我在 Polymer GitHub 存储库中也没有看到。此外,我不记得在 Material Design 规范中看到任何关于选择框的外观或行为方式的具体指导。

有提议吗?或将选择框设计纳入材料设计/聚合物纸元素的具体计划?

我完全理解您基本上可以从复选框(多)或单选按钮(单)中获得相同的功能,但从美学的角度来看,取决于特定的应用程序,我觉得拥有“选择”可能是个好主意可作为一个选项。

0 投票
7 回答
88879 浏览

android - Android L 的涟漪效应 - 按钮的触摸反馈 - 使用 XML

我试图了解如何为按钮和其他视图实现“涟漪效应 - 触摸反馈”。我查看了与 SO 上的 Ripple touch effect 相关的问题,并对它有所了解。我能够使用这个 java 代码成功地获得涟漪效应。

但是,我想使用 XML 方法。我如何实现这一目标?我看过这个这个,但我对样式还不是很满意,所以我发现很难实现涟漪效应。

我有一个带有以下 XML 代码的按钮:

我如何获得此按钮的涟漪效果。如果有人可以指导我,我将不胜感激。

[编辑] 添加ripple.xml 和background.xml,如上面的链接之一所述。我在 res 中创建了一个 drawable-v21 文件夹,并在那里添加了以下文件。

波纹.xml

背景.xml

我添加了波纹作为我的按钮的背景,现在这是我的按钮的 xml..

当我运行应用程序时,我得到一个 ResourceNotFoundException。这是logcat跟踪..

0 投票
5 回答
10897 浏览

android - 有没有办法在 API < 21 (5.0 Lollipop) 中做一个 Material 风格的阴影?

材料设计非常强调“纸”的隐喻。要制作这些,阴影是必不可少的。由于 Material design 是一种哲学而不是 API(尽管它被内置在 L 中),因此应该在任何地方(Windows 窗体、HTML/CSS 等)完成。如何在 Android API 14 到 20 中执行此操作?

请注意,预制的 PNG 对于圆形和其他非方形形状并不实用。

0 投票
2 回答
12463 浏览

android - 将默认设计主题更改为自定义颜色

我对 Android Studio 很陌生。作为初学者,我创建了一个简单的应用程序,仅用于测试目的并查看 Android Studio Material 主题的外观。我目前正在使用最新版本,即。l 预览 - Studio 0.8.2 版本。

在这里,我刚刚创建了 textview、edittext、单选按钮和复选框。当我选择男性或女性时,它会出现天蓝色。我可以将天蓝色更改为绿色或黄色吗?

我不知道那是什么名字。从图片中可以看到edittext、单选按钮和复选框的选中状态为天蓝色。当我尝试单击或选择任何内容时,这些复选框或单选按钮需要从默认颜色更改为其他颜色,例如绿色或黄色!

代码

在 res/values/styles.xml 中,

在 Android Studio Manifest.xml 中,

是否有任何其他可能从默认的天蓝色更改为绿色或黄色或紫色?

Android Studio 默认颜色

有没有其他方法可以将默认的天蓝色主题更改为其他颜色,如粉红色或绿色?

我怎么能这样做?

0 投票
3 回答
1828 浏览

famo.us - 如何实现google paper按钮效果

谷歌的纸张/材料设计http://www.google.com/design/spec/material-design/introduction.html 是一个非常干净的外观,我认为会看到很多用途。Polymer 有一堆“纸元素”准备好了,网络社区已经在尝试不同的方式来实现它。对于这个问题,我专门研究了按钮点击效果。

它有一个激活颜色的涟漪,从你的点击中散发出来。这是聚合物的示例:http ://www.polymer-project.org/components/paper-elements/demo.html#paper-button ,这是一个 css jquery 示例:http ://thecodeplayer.com/walkthrough/ripple-点击效果谷歌材料设计

我的问题是如何去实施它?

看一下聚合物示例 当您按下鼠标时,它可能会发出背景颜色偏移,而不是另一个示例中的彩色不透明度波纹。它在达到极限时保持不变,然后在 mouseup 上它迅速消失。

因为我可以很容易地看到第二个示例背后的代码,所以我尝试以与它类似的方式实现它,但使用触摸事件而不是点击除外,因为如果我所做的只是触摸而不是释放,我希望它保持效果.

我尝试缩放,转换设置不透明度的位置,但是从触摸点向外辐射的位置和效果超出了我的范围,或者至少从我到目前为止所投入的时间来看。事实上,总的来说,我在动画部门的经验不足。

关于如何实施它的任何想法?

0 投票
1 回答
87 浏览

android - Android Studio 调试

我想为我即将推出的 Android 应用程序学习材料设计,现在我昨天开始了。我创建了一个项目,并希望第一次构建并运行它。(我用我的手机来调试和构建而不是模拟器)

但现在我不断收到此错误:

我唯一添加/更改的是添加标签。

注意:在我添加这一行之前,它已经给出了这个错误。

我真的很感激你的帮助。

预先感谢您的时间

亲切的问候,耶勒·罗格坎普