material-design 相关问题

材料设计是Google针对Android 5.0 Lollipop引入的跨平台和设备的视觉,动作和交互设计指南。

关于android中ShapeableImageView的圆形图像视图的问题

我找到了几个答案来制作一个用材质 ShapeableImageView 圈出的视图,如下面的代码所示。 答案1 <p>我找到了几个答案来制作一个用材质 ShapeableImageView 圈出的视图,如下面的代码。</p> <p><a href="https://howtodoandroid.com/shapeableimageview-material-components-android" rel="nofollow noreferrer">答案1</a></p> <pre><code>&lt;style name=&#34;ShapeAppearanceOverlay.App.CornerSize50Percent&#34; parent=&#34;&#34;&gt; &lt;item name=&#34;cornerSize&#34;&gt;50%&lt;/item&gt; &lt;/style&gt; </code></pre> <p><a href="https://stackoverflow.com/questions/66624415/shapeableimageview-doesnt-round-corners">回答2</a></p> <pre><code>&lt;style name=&#34;ShapeAppearanceOverlay.App.circleImageView&#34; parent=&#34;&#34;&gt; &lt;item name=&#34;cornerFamily&#34;&gt;cut&lt;/item&gt; &lt;item name=&#34;cornerSize&#34;&gt;50%&lt;/item&gt; &lt;/style&gt; </code></pre> <p><a href="https://stackoverflow.com/a/61986850/13892944">答案3</a></p> <pre><code>&lt;style name=&#34;roundedImageViewRounded&#34;&gt; &lt;item name=&#34;cornerFamily&#34;&gt;rounded&lt;/item&gt; &lt;item name=&#34;cornerSize&#34;&gt;50%&lt;/item&gt; &lt;/style&gt; </code></pre> <p>然后,该类型的样式就被Material ShapeableImageView中的这个属性引用了</p> <blockquote> <p>app:shapeAppearanceOverlay="@style/correspondingStyleName"</p> </blockquote> <p>我应用了这些并且一切正常(除了答案2中的那个,因为它的cornerFamily是切割的而不是圆形的)。我的观点是一切正常。然而,要使用其中的最佳实践,我想知道一些事情。</p> <ol> <li>为什么 ShapeableImageView 具有 <pre><code>app:shapeAppearanceOverlay</code></pre> 属性并引用样式,而不仅仅是具有 <pre><code>cornerFamily</code></pre>、<pre><code>cornerSize</code></pre> 属性? (如果不继承任何东西,那么使用 <pre><code>app:shapeAppearanceOverlay</code></pre> 属性有什么意义?)</li> <li>为什么这些样式要么继承空父级,要么什么都不继承?</li> <li>在哪里可以找到 ShapeableImageView 的示例代码?我试图在 Material Design github 页面上找到它,就像如何使用 <a href="https://github.com/material-components/material-components-android/blob/master/docs/components/Button.md" rel="nofollow noreferrer">material Button</a> 一样,但我找不到它。</li> </ol> <p>提前致谢。</p> </question> <answer tick="false" vote="0"> <p>它已经写在 Android GitHub 页面的 Material Components 上,可以在<a href="https://github.com/material-components/material-components-android/blob/master/docs/theming/Shape.md" rel="nofollow noreferrer">这里</a>获取。</p> </answer> </body></html>

回答 0 投票 0

为什么已弃用的基于高度的色调叠加仍然出现在 Material Design 3 组件规格页面中?

我使用--md-sys-color-surface-container-low作为我的卡片表面颜色,然后我参考了Material 3的卡片组件规格页面,它说其中一个规格是高架卡片容器表面。 ..

回答 1 投票 0

使用带有 Compose Navigation 的嵌套脚手架时,TopAppBar 具有未知的填充

我在应用程序的根级别有一个脚手架,我在其中托管导航。这个脚手架没有顶部应用栏,只包含一个 FAB。然后,在其中一个目的地,我使用另一个脚手架

回答 1 投票 0

如何在使用react typescript + vite的代码中使用web Material 3组件

是否可以在React TypeScript + Vite中使用Web Material 3 Google组件? 我尝试按如下方式使用它 导入“@material/web/checkbox/checkbox.js”; 函数应用程序(){ 返回 ( 是否可以在React TypeScript + Vite中使用Web Material 3 Google组件? 我尝试如下使用它 import '@material/web/checkbox/checkbox.js'; function App() { return ( <div style={{ padding: 16 }}> <h1>Checkbox com Material Web 3 no React</h1> <md-checkbox id="checkbox1">Checkbox Material 3</md-checkbox> </div> ); } export default App; 我收到错误 Property 'md-checkbox' does not exist on type 'JSX.IntrinsicElements' 可以使用react typescript + vite吗? 您可以通过将 Material 组件作为字符串传递到您的 React 应用程序来实现它,但您应该担心它会引起一些安全问题。 这是示例代码: import "@material/web/button/filled-button.js"; import "@material/web/button/outlined-button.js"; import "@material/web/checkbox/checkbox.js"; function App() { return ( <div> <div dangerouslySetInnerHTML={{ __html: `<label> Material 3 <md-checkbox checked></md-checkbox> </label> <md-outlined-button>Back</md-outlined-button> <md-filled-button>Next</md-filled-button>`, }} /> </div> ); } export default App;

回答 1 投票 0

如何更改垫扩展面板的图标/切换颜色?

我已经尝试过使用: .mat-扩展-面板-标题{ 颜色:#fff; } .mat-expansion-panel-header::after{ 颜色:#fff; } .mat-扩展面板{ 颜色:#fff; } .mat-expansion-panel::after{ 颜色:...

回答 3 投票 0

自定义材质主题没有--mat和--mdc颜色变量集

我已经将我的项目从 Angular 材质 2 更新为 Angular 材质 3,并使用最后一次更新(18.2.1),为什么组件的所有变量都没有设置?主题类由“nggenerate@an...

回答 1 投票 0

如何在 Angular Material 18+ 中处理高程?

根据材质3规范,不同的高度应该通过颜色而不是阴影来处理。然而,在我的 Angular Material 18 项目中,所有背景似乎都相同

回答 1 投票 0

如何将自定义调色板添加到 Angular M3 主题?

我可以创建一个例如具有自定义颜色的自定义主调色板。 我可以添加其他调色板,例如带有“自定义”名称的“主”调色板以及其他自定义颜色和名称。 我想添加一个...

回答 1 投票 0

material Design TextBox 更改主题时提示可读性 WPF C#

我想使用材料设计和我添加到项目中的演示中的调色板部分向我的项目添加两种深色和浅色模式。这里的问题是有些项目,例如 hi...

回答 1 投票 0

材料数据表 - NullInjectorError:没有 CdkColumnDef 的提供程序

如何在没有数据源(静态数据)的情况下使用材料设计数据表布局?我在 https://material.angular.io/components/table/examples 上找不到此用例的示例。比如我

回答 2 投票 0

带有包含 LazyColumn 的卡片的脚手架不滚动

我的屏幕位于支架中,其中包含带有嵌套 LazyColumn 的卡片。 如果 LazyColumn 项的大小超过屏幕高度,则卡片不能完全滚动。 这是一个错误还是我......

回答 1 投票 0

材质设计:带有卡片自动高度的网格

我正在寻找一个带有卡片自动高度的网格,如下所示: 我正在使用 Material Design 和 Angular 4,如果有一些使用 React 或 VueJS 的解决方案也很好。 我开始...

回答 2 投票 0

如何创建一个带有模糊背景的模态BottomSheet,而不是默认的灰色半透明

我正在使用模态底板,如何将默认的灰色半透明背景更改为模糊背景,就像我们在 iOS 中看到的那样

回答 2 投票 0

更改 Material Design 文本输入的框描边颜色

我正在使用 IntelliJ IDE 和 Kotlin 创建一个应用程序。 我一直在尝试改变属性, 应用程序:boxStrokeColor 我的组件, com.google.android.material.textfield.TextInputLayout 但每个...

回答 1 投票 0

ModalDrawerSheet 不可滚动

我使用Android jetpack库和Material3设计实现了导航,即ModalNavigationDrawer和ModalDrawerSheet组件。到目前为止一切顺利,但是当旋转屏幕时,n...

回答 1 投票 0

如何以有意义的方式显示材质3的颜色?

主题使用 colorSchemeSeed 自行构建,但我不知道哪些颜色适用于哪些小部件和属性,因为它们的命名都很混乱。 目前还没有这样合适的网站服务...

回答 3 投票 0

DropdownButtonFormField 所选项目被剪掉

在具有以下 selectedItemBuilder 的 DropdownButtonFormField 中: 选定的项目生成器:(上下文){ 返回 widget.vatRates.vatRateList!.map((item) { 返回填充( ...

回答 1 投票 0

Flutter:全局主题不适用于替代路线

我定义了一个全局主题,在我的 main.dart 中调用。这是代码: 导入'包:flutter/material.dart'; 导入“包:firebase_core/firebase_core.dart”; 导入'包:flutter_bloc/

回答 1 投票 0

Flutter 用于 Web 和移动设备的卡片高度/宽度

我正在尝试使用多张卡片来显示一些结果。 我的代码非常适合 Flutter 网络,但不适用于移动设备 @覆盖 小部件构建(BuildContext上下文){ 最终布尔显示MobileLa...

回答 1 投票 0

将 MaterialDatePicker 日历语言设置为仅英语

我在我的android应用程序项目中使用MaterialDatePicker。该应用程序还支持多种本地语言。 现在的问题是,当我选择英语以外的应用程序语言时,日历语言也会出现

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.