material-design 相关问题

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

MDC:Material3 MaterialCalendar 背景颜色

如何更改材质日历背景?我正在设置白天和夜间主题,除了夜间模式外,它正在工作,其中设置的颜色背景未正确应用。 这就是预期...

回答 1 投票 0

是否有 Angular 中所有垫子图标的官方或详尽列表?

我已经开始使用 Angular Material 中的 ,我想知道是否有所有包含的图标名称的官方列表。几个月前,我发现一个页面上有一堆...

回答 4 投票 0

如何在自动完成暴露的下拉菜单上设置背景颜色?

目前正在使用材料设计组件和菜单指南来设置公开的下拉菜单项。但是,当显示我的自动完成文本视图时,它没有...

回答 4 投票 0

检测Material Design按钮是否被点击

我试图在单击 Material Design 按钮组件时运行一些代码。 似乎没有任何作用...你能帮忙吗? 我已经尝试过以下方法: 选择按钮时使用 onclick...

回答 2 投票 0

如何在android中实现垂直选项卡布局?

我正在尝试在平板电脑上运行的应用程序上实现垂直选项卡布局。我尝试将 TabLayout 的方向设置为垂直,但没有成功。 我正在尝试在平板电脑上运行的应用程序上实现垂直选项卡布局。我尝试将 TabLayout 的方向设置为垂直,但没有成功。 <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> <com.google.android.material.tabs.TabLayout android:id="@+id/staff_menu_tabs" android:layout_height="match_parent" android:layout_width="wrap_content" android:orientation="vertical" app:layout_constraintStart_toStartOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintTop_toTopOf="parent"> <com.google.android.material.tabs.TabItem android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Tab 1"/> <com.google.android.material.tabs.TabItem android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Tab 2"/> <com.google.android.material.tabs.TabItem android:layout_height="wrap_content" android:layout_width="wrap_content" android:text="Tab 3" /> </com.google.android.material.tabs.TabLayout> </androidx.constraintlayout.widget.ConstraintLayout> 我使用以下代码制作了垂直 tabLayout。 <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:rotation="-90" android:transformPivotX="0dp" android:layout_marginTop="@dimen/tab_width" android:layout_marginLeft="-24dp"> <com.google.android.material.tabs.TabLayout android:layout_width="@dimen/tab_width" android:layout_height="wrap_content" android:background="@color/black" app:tabTextColor="@color/light_grey" app:tabSelectedTextColor="@color/white" app:tabIndicatorHeight="2dp" app:tabIndicatorColor="@color/white" app:tabPaddingBottom="-10dp"> <com.google.android.material.tabs.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="ABC"/> <com.google.android.material.tabs.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="XYZ"/> </com.google.android.material.tabs.TabLayout> </androidx.constraintlayout.widget.ConstraintLayout> 这是使用 Jetpack Compose 实现的 Vertical-TabLayout 库 https://github.com/mohdDanishCode/MDVerticalTabLayout

回答 2 投票 0

Android MaterialButton 在drawableLeft 图标和文本之间填充

正如题目所说,用materialButton,我想设置drawableLeft图标和文字之间的距离,我不想用icon,只是drawableLeft 默认情况下,drawableleft图标距离很远...

回答 2 投票 0

如何在 Kotlin 中将 NavigationRailView 与导航组件结合使用

我正在使用 BottomNavigationView 和导航组件,如下所示: 活动主文件 我正在使用 BottomNavigationView 和导航组件,如下所示: activity_main.xml <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <com.google.android.material.appbar.AppBarLayout android:id="@+id/appbar" --------- > <com.google.android.material.appbar.MaterialToolbar android:id="@+id/toolbar" /> </com.google.android.material.appbar.AppBarLayout> <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/purple_500" android:clipToPadding="true" android:fitsSystemWindows="true" app:itemIconTint="@drawable/bottom_nav_selector" app:itemTextColor="@drawable/bottom_nav_selector" app:menu="@menu/menu_history_navigation" app:labelVisibilityMode="selected" app:layout_constraintTop_toBottomOf="@id/appbar" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> <androidx.fragment.app.FragmentContainerView android:id="@+id/historyNavHost" android:name="androidx.navigation.fragment.NavHostFragment" android:layout_width="match_parent" android:layout_height="0dp" app:layout_constraintVertical_weight="1" app:defaultNavHost="true" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/navigation" app:navGraph="@navigation/nav_graph_history" /> </androidx.constraintlayout.widget.ConstraintLayout> MainActiviy.kt class MainActivity : AppCompatActivity() { private val binding: ActivityMainBinding by lazy { ActivityMainBinding.inflate(layoutInflater) } private val navController: NavController by lazy { (supportFragmentManager.findFragmentById(R.id.historyNavHost) as NavHostFragment).navController } override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(binding.root) setupToolbar() binding.navigation.setupWithNavController(navController) } } 而且效果很好。但我想在activity_main.xml的横向布局中使用NavigationRailView而不是BottomNavigationView。更改后 binding.navigaitonRailView.setupWithNavController(navController) 上面的行抛出此错误 Unresolved reference. None of the following candidates is applicable because of receiver type mismatch: 如何使用 NavigationRailView 和 NavConroller? 任何帮助将不胜感激! 您还需要 NavigationUI 和 navController val navigationRailView = binding.navigationRail NavigationUI.setupWithNavController( navigationRailView, navController )

回答 1 投票 0

SmartTabLayout 点击时的波纹效果

我正在使用 SmartTabLayout,当我单击或选择选项卡时,我想禁用波纹效果和一些灰色方形背景。 我将此代码添加到我的 xml 但仍然不起作用: 应用程序:tabBackground =“?...

回答 2 投票 0

Material 2 Date Picker Android 文字尺寸这么小

我在MDC中实现Material 2 DatePicker时遇到了这个问题。运行时文字大小看起来很小。我还没有为我的日期选择器实现任何主题/样式 屏幕截图日期选择器 我看教程

回答 1 投票 0

Android 中的静止高度是什么?

我对“静息海拔”这个词有点困惑。我知道 Android Material Design 环境中的海拔是什么,但无法确切知道什么是静止海拔。难道是零海拔...

回答 1 投票 0

材质-UI定义列表

我正在尝试使用 React Material-UI 实现以下目标,减去右侧的扩展插入符: 这是 Google 页面上的规范。 https://material.io/guidelines/components/expansion-panels...

回答 5 投票 0

如何在Android中自动为Material3创建色调调色板和颜色?

Google 的 Material3 提供了一个颜色系统,以确保整个应用程序的设计一致性。 然后我查看了 Google 提供的 Reply 示例应用程序。它将所有颜色硬编码为 ARGB 颜色整数。 是

回答 1 投票 0

Android TextInputLayout[提示在编辑字段内而不是在边框外]

我正在尝试在输入字段内创建带有提示的 TextInputLayout,如下所示: 这是我的代码,我尝试使用 OutLinedBox 和 Filled,如果我使用 Filled 并为布局设置背景,位置...

回答 1 投票 0

带有纯CSS的色调调色板

我不知道如何用纯css实现这个设计系统。谁能指导我使用什么 css 功能? 这是关于增加/减少 hsl 功能的亮度吗?我第一次做这种事...

回答 1 投票 0

如何确定使用哪种材质颜色来做什么

我正在学习 Android (Compose) 开发,最近遇到了一个我无法正确理解主题的问题。我的问题是我不知道哪个颜色名称(primary、onPrimary、backgro...

回答 1 投票 0

Android Material Slider - 以编程方式显示标签

标签通常会隐藏,直到用户按下手柄(拇指)。 这一切都很好。 但是有没有办法以编程方式显示标签几秒钟? 基本上显示标签没有...

回答 1 投票 0

如何在 Flutter 中的 DropdownMenu 项之间放置分隔线

我有一个 DropdownMenu,我想在 DropDownMenuEntries 之间绘制一条水平分隔线(线)。 'dropdownMenuEntries' 属性只需要一个 DropDownMenuEntry 小部件列表。 任何帮助都会

回答 1 投票 0

在 Angular 15 中,如何减小表单字段的大小?

我正在尝试尽可能简单地减小 Angular 15 中表单字段和字体的大小。在从 13 升级到 15 的过程中,现有的 UI 相当糟糕。 超文本标记语言 我正在尝试尽可能简单地减小 Angular 15 中表单字段和字体的大小。在从 13 升级到 15 的过程中,现有的 UI 相当糟糕。 HTML <div class="example-container"> <mat-form-field appearance="outline"> <mat-label>Select me long text end with ellipse</mat-label> <mat-select> <mat-option value="option">Option</mat-option> </mat-select> </mat-form-field> </div> CSS mat-form-field { width:150px; } .mat-mdc-text-field-wrapper { height: 30px; } 当我在 Google 开发工具中使用这些选择器调整大小时,它可以工作 - 但在 Stackblitz 中却不起作用。但是,即使尺寸减小,垫标签文本也是开箱即用的并且不居中。我弄乱了填充和一堆其他东西,但我无法让它工作。 有没有简单的解决方案可以将其缩小到更小的尺寸? 这是我的解决方案: <mat-form-field style="font-size: 12px" appearance="outline"> <mat-label>Name</mat-label> <input matInput placeholder="Name..." autocomplete="off"/> </mat-form-field> 您可以通过在标签上应用 css 来更改表单字段标签的大小 mat-form-field { } 虽然 ng-deep 在技术上已被弃用,但我使用以下代码来更改新的 MDC Angular Material 表单字段的高度。 ::ng-deep .mat-mdc-text-field-wrapper { max-height: 20px; } ::ng-deep .mat-mdc-form-field { max-height: 30px; } ::ng-deep .mat-mdc-form-field-infix { padding: 0 !important; } 简短说明本示例中这些类的用途: .mat-mdc-text-field-wrapper 用于表单字段内的文本大小。保持此不变将使文本呈现在调整大小的表单字段之外。 .mat-mdc-form-field 用于表单字段的实际大小。 .mat-mdc-form-field-infix 用于去除填充物。不更改此设置会将输入推离表单字段。不要忘记这里的重要属性。 您需要尝试所有这三个值,以获得一组适合您的情况的值。

回答 3 投票 0

#Flutter 浮动导航栏,底部元素可见

我想制作一个可以实现此目的的包: 但这就是我的进步。仍然有一个白色的背景。 这是包的链接 https://github.com/dinurymomshad/flutter_navigation_d...

回答 2 投票 0

Material-UI React Table 在渲染时抛出边框

我正在寻找快速解决此问题的方法。似乎每当我从 Material-UI.com 表中的 API 调用返回的数据集进行渲染时(在样式方面没有添加会使其失效)...

回答 1 投票 0

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