标签: material-design

当我使用自动完成来获取所选日期时，所选选项不会被过滤。因此我能够选择相同数据的多个实例。虽然当我删除 OnChange 道具时它会给出结果，但现在我无法更新状态。

<Autocomplete
  multiple
  name="ClassSchedule"
  onChange={(event, value) => setDays(value)}
  ChipProps={{
    style: {
      backgroundColor: "#2EC5B6",
      borderRadius: "5px",
      color: "#fff",
      fontFamily: "Source Sans Pro",
    },
  }}
  id="tags-standard"
  options={[
    { title: "sunday" },
    { title: "monday" },
    { title: "tuesday" },
    { title: "wednesday" },
    { title: "thursday" },
    { title: "friday" },
    { title: "saturday" },
  ]}
  getOptionLabel={(option) => option.title}
  renderInput={(params) => (
    <CssTextField
      {...params}
      style={{
        borderRadius: "10px",
        backgroundColor: "#F5FCFB",
        fontFamily: "Source Sans Pro",
      }}
      variant="outlined"
      id="custom-css-outlined-input"
    />
  )}
/>

我想将密码切换图标添加到 Swift 中的文本字段，并且我正在使用材料设计库，具体来说，填充了 MDC 文本输入。如何以编程方式将尾随图标添加到文本字段的右侧？我已经看到尾随图标是材料设计的一部分，但找不到它的文档。

我在使用 TextInputLayout 实现材质设计时遇到问题，我知道解决方案是让您的活动主题继承材质组件主题之一，但这会给我的大多数应用程序主题带来此类更改，并且需要更多时间来重构它。我想要的是应用程序上这个特定 TextInputLayout 的材质设计。

这就是我尝试过的

<com.google.android.material.textfield.TextInputLayout
                android:id="@+id/firstName"
                style="@style/CustomInputStyle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginEnd="5dp"
                android:layout_weight="1"
                app:errorEnabled="true">

                <com.google.android.material.textfield.TextInputEditText
                    android:id="@+id/fname"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="@string/first_name"
                    android:inputType="text|textCapWords"
                    android:nextFocusDown="@id/lname"
                    android:textSize="12sp" />

</com.google.android.material.textfield.TextInputLayout>




<style name="CustomInputStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
            <item name="boxStrokeWidth">2dp</item>
            <item name="hintTextColor">@color/colorAccent</item>
            <item name="boxStrokeColor">@android:color/white</item>
            <item name="android:colorAccent">@color/colorAccent</item>
            <item name="android:textColorHint">@color/colorAccent</item>
        </style>

错误 ： Caused by: java.lang.IllegalArgumentException: The style on this component requires your app theme to be Theme.MaterialComponents (or a descendant).

我们不能这样做而不是覆盖整个应用程序/活动主题吗？我想要的只是在特定的片段中使用它。

我正在将我的应用程序迁移到Theme.Material3.*，发现MaterialToolbar一旦某些内容在其下方滚动，它就会以某种强调色突出显示。请参阅下面我提到的动画：

但是，我不希望这种效果出现在我的应用程序中。但在阅读MaterialToolbar 文档时，似乎没有办法禁用或修改它，这让我很恼火。我在这里缺少什么？

重现行为的最小 XML 布局（以及使用Material3 主题）：

<androidx.coordinatorlayout.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:liftOnScroll="true">

        <com.google.android.material.appbar.MaterialToolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:titleCentered="true"
            app:title="Welcome"
            app:layout_scrollFlags="noScroll" />

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
   
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Lorem ipsum dolor sit amet..." />

    </androidx.core.widget.NestedScrollView>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

感谢您的帮助。

我希望我的 Android 应用程序的工具栏与主表面颜色相同（以及状态栏——这已经是干净的 Android Studio 项目中开箱即用的主表面颜色）。我的目标是 Material Design 3 UI 指南。

对于以前版本的 Android，有各种现有的答案，质量各异，涉及运行相当长的样式和主题兔子洞，以捕获工具栏中错误的 UI 部分（图标、菜单等）。在 Android 的各种早期版本中，存在主题覆盖以及可生成浅色/浅色工具栏或深色/深色工具栏应用程序的主题变体。但这些钩子似乎都不存在于 Material3 中——根据设计，Material3 应该具有相同颜色的工具栏。

使用相对默认的配置，我的工具栏是（我认为）原色背景，白天为白色文本，晚上为白色背景上的黑色（主？）文本（相对于主表面和辅助表面相反）。而且我找不到道德上相当于白天/夜间主题的灯光工具栏灯光背景，希望能够尊重那些拥有 android 12++ 的壁纸匹配颜色（我确实如此）。

我觉得我在这里缺少一些简单的东西。

Fwiw，我没有使用 CoordinatoryLayout/AppLayout —— 只是一个裸露的工具栏，因为之前与 CoordinatorLayout 的不愉快争论以及在全屏模式下运行 Activites，我也将在这个项目中这样做。（CoordinatorLayout 没有给我任何我想要的东西，并且破坏了很多我想要的）。

我确实尝试在工具栏上设置明确的颜色，并且当图标没有改变颜色时运行到这里。（我以前已经走过这条路，至少在三个版本的 Android 上。:-P）。

该应用程序是一个新创建的（大约一周前）Android 应用程序，使用 Android studio 和最新的 SDK 创建。应用程序主题似乎已指向材料 2，尽管材料 3 的所有依赖项都是最新的。很难说；所有 Android 文档都告诉您如何迁移旧应用程序，而不是如何创建新应用程序——这是一个奇怪的遗漏。

我正在尝试更改顶部栏的背景颜色并使其像主背景一样。我正在使用Material You (MD3)。

用户可以从浅色模式更改为深色模式，反之亦然。

这是我尝试做的：

值\主题.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="Theme.App" parent="Theme.Material3.Light.NoActionBar">
        <item name="android:colorBackground">@color/md_theme_light_background</item>
        ...
    </style>
</resources>

值夜\themes.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="Theme.App" parent="Theme.Material3.Dark.NoActionBar">
        <item name="android:colorBackground">@color/md_theme_dark_background</item>
        ...
    </style>
</resources>

颜色.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="md_theme_light_background">#FCFDF7</color>
    <color name="md_theme_dark_background">#1A1C19</color>
    ...
</resources>

活动主文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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"
    android:orientation="vertical"
    tools:context=".activities.MainActivity">

    <com.google.android.material.appbar.MaterialToolbar
        android:id="@+id/topBar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?android:attr/colorBackground"
        android:elevation="4dp"
        app:title="@string/app_name" />

    ...

</LinearLayout>

结果（深色模式）

正如你所看到的，顶部栏的背景颜色一定是，#1A1C19但它变成了#222E22，从哪里来的#222E22？

我试图在 MD3 文档中找到任何有关此内容的内容，但没有找到任何内容。你能告诉我为什么颜色会自动改变吗？

注意：如果我md_theme_dark_background从 …

所以我有这样的设计：

我怎样才能在 Flutter 中实现这一目标？

我从ABS切换到AppCompat和Material主题(仅适用于api 21)

<!--manifest: -->
<application
        android:theme="@style/AppStyle"

<-- values folder -->
<style name="AppStyle" parent="@style/AudioRecTheme">
<style name="AudioRecTheme" parent="@style/Theme.AppCompat.Light">

<!-- values-v21 folder-->
<style name="AudioRecTheme" parent="@android:style/Theme.Material.Light">

我的活动:

public class AudioRecActivity extends FragmentActivity

操作栏仅在Android 5.0中显示,但缺少其他操作.

我想用Twitter App等徽标替换工具栏中的标题.

我想我们可以像这样以编程方式替换它:

mToolbar = (Toolbar) findViewById(R.id.app_toolbar);
mToolbar.setLogo(R.drawable.ic_logo);

但我想直接在我的XML工具栏声明中替换它,但我看不到属性app:logo或android:logo.

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/app_toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:theme="@style/MyCustomToolBarTheme" />

请帮帮我,谢谢.

我希望我的抽屉从工具栏下方的左侧打开.但是,根据材料设计方面,这并不好.但我仍然想这样做.

在这里,我更改了我的XML文件.
---相对布局
-----工具栏
-----抽屉
-------容器
-------抽屉列表

这是我的XML文件.我的应用程序在打开时崩溃了.我不知道我在哪里犯了错误,XML没有显示任何错误.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<include
    android:id="@+id/toolbar"
    layout="@layout/toolbar" />

<android.support.v4.widget.DrawerLayout
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/container_body"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <fragment
        android:id="@+id/fragment_navigation_drawer"
        android:name="com.myApp.activity.FragmentDrawer"
        android:layout_width="@dimen/nav_drawer_width"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:layout="@layout/fragment_navigation_drawer"
        tools:layout="@layout/fragment_navigation_drawer" />

</android.support.v4.widget.DrawerLayout>

</RelativeLayout>