首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何使用材质设计更改顶部工具栏中图标和标题的颜色?-NoActionBar主题- Android material design

材质设计是一种现代化、直观且美观的设计风格,适用于Android应用程序的开发。在顶部工具栏中,你可以通过使用NoActionBar主题以及一些代码来更改图标和标题的颜色。

首先,你需要使用NoActionBar主题来移除默认的ActionBar。在AndroidManifest.xml文件中找到你的Activity,并在其主题属性中设置为NoActionBar。示例代码如下:

代码语言:txt
复制
<activity
    android:name=".YourActivity"
    android:theme="@style/Theme.AppCompat.NoActionBar">
</activity>

接下来,在你的Activity的布局文件中,添加一个Toolbar来代替ActionBar。示例代码如下:

代码语言:txt
复制
<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</androidx.appcompat.widget.Toolbar>

然后,在你的Activity的Java文件中,通过调用setSupportActionBar()方法,将Toolbar设置为Activity的ActionBar。示例代码如下:

代码语言:txt
复制
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

现在,你可以使用Toolbar的相关方法来更改图标和标题的颜色。示例代码如下:

代码语言:txt
复制
// 更改标题文字的颜色
toolbar.setTitleTextColor(getResources().getColor(R.color.your_color));

// 更改导航图标的颜色
toolbar.getNavigationIcon().setColorFilter(getResources().getColor(R.color.your_color), PorterDuff.Mode.SRC_ATOP);

上述代码中,"your_color"是你想要设置的颜色的资源值。

对于腾讯云相关产品,由于要求不提及具体品牌商,你可以自行在腾讯云官网上查找与材质设计相关的产品和服务。在腾讯云官网的产品页面,你可以找到与移动开发、前端开发等相关的云服务,并查看它们的详细介绍和文档。

希望这些信息能对你有所帮助!

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

flutter 起步

MaterialApp:什么是MaterialAppMaterialApp是我们使用 Flutter开发中最常用符合Material Design设计理念入口Widget。...,会回调相关操作8. builder当构建一个Widget前调用一般做字体大小,方向,主题颜色等配置9. title该标题出现在Android:任务管理器程序快照之上IOS: 程序切换管理器10....onGenerateTitle跟上面的tiitle一样,但含有一个context参数用于做本地化11. color该颜色Android中程序切换应用图标背景颜色,当应用图标背景为透明时12. theme...Scaffold :Scaffold 实现了基本 Material Design 布局结构。在 Material 设计定义单个界面上各种布局元素,在 Scaffold 中都支持。...iconTheme → IconThemeData - Appbar 上图标颜色、透明度、尺寸信息。默认值为 ThemeData.primaryIconTheme。

4.5K20
  • Flutte部件目录-基本部件(三) 顶

    Appbar 一个Material Design应用程序栏。 ? 应用程序栏由工具栏其它可能部件(如TabBarFlexibleSpaceBar)组成。...AppBar在底部(如果有)上方显示工具栏部件,leading,标题操作。底部通常用于TabBar。 如果指定了一个flexibleSpace部件,那么它将堆叠在工具栏底部部件后面。...它高度将与应用栏整体高度相同. [...] final iconTheme → IconThemeData 用于应用程序栏图标颜色,不透明度大小。...如果您希望标题占用所有可用空间,请将此值设置为0.0. [...] final toolbarOpacity → double 应用栏工具栏部分透明度如何. [...]...也可以看看: IconTheme, 为图标提供环境配置. Icon, 用于显示图标材质设计图标库. ImageIcon,用于显示来自AssetImages或其他ImageProviders图标.

    6.3K10

    探索 Android Design Support Library v28 新增内容

    Material Button Material Button 是一个小部件, 可用于在你应用程序用户界面显示材质样式按钮....这个类从你可能已经使用 AppCompatButton 类继承而来. 它们之间有什么不同呢? 这个按钮开箱即用, 它被设计成具有物质本质外观质感, 而无需使用样式标志定义....我们按照原样使用 MaterialButton 类, 并且在我们视图中, 它将具有我们所追求材质外观质感 -- 将其视为一个提供方便类. ?..." app:icon="@drawable/ic_android_white_24dp" /> 默认情况下, 此类将使用主题 accent colour 填充按钮背景颜色, 同时使用白色作为按钮文字颜色...结论 在我看来, 这些是对 Support Library 一些简洁补充 -- 我期待着能够立即使用材质主题组件.

    1.9K20

    6详解AppBar小部件

    Flutter AppBar 是根据Material Design指南构建应用程序组件。它通常位于屏幕顶部,并且能够在其布局包含其他小部件。...您可以使用它来显示图标、图像、形状或使用布局小部件(例如row任意组合column。...AppBar 包含各种属性,包括颜色、大小、图标主题、文本主题等等。 背景颜色 以下代码将 AppBar 背景颜色更改为深橙色。500添加以访问颜色特定阴影,900即最暗最亮50。...工具栏高度不透明度 最后,我们有工具栏属性。工具栏包含文字,图标,按钮,其他任何公司前景,除了小部件,如ContainerImage。...布局添加小部件 如何为 AppBar 图标、文本、背景、高度、阴影颜色工具栏设置主题 所以我们有了!

    16.4K10

    Head First Android Toolbar

    自从Android 5.0引入了Material Design之后,这个兼容支持库增加了一个任务,那就是为低版本系统提供与Material Design兼容组件。...,界面风格统一,操作方式一致,同时将Material Design设计风格带到了以前低版本Android系统。...ActionBar功能,默认提供了很多种元素可以放置在Toolbar上,其中包括导航按钮、logo图标标题标题、一个或多个自定义View以及菜单项。...Theme设置为AppTheme.NoActionBar就好了 (3.2)添加Toolbar 在Layout文件添加Toolbar组件,就把它当做一个普通View组件来使用即可 <Toolbar...此外,虽然可以这么设置,但是目前AppCompat对于以前低版本Android系统提供Material Design支持还是很有限,参见Styling Material Toolbar in Android

    89320

    不懂设计产品不是好开发

    对于主色调,Material设计浅色主题通常使用500色调,对于深色主题建议使用较浅饱和度色调(200-50范围)。...Codeland标志更像是长方形,边角处有一个非常小圆角值。 5. Icons Material设计图标是极简,现代,并在Apache许可版本下,使其可以免费使用重新混合使用。...图标字体是用字体字形绘制,但不是字母,而是图标形状。在Android项目中,我们将SVG文件材质设计图标作为XML文件添加到资源文件夹。...Flutter通过从字体集中移除未使用符号来优化Material design图标库,这就减少了应用程序大小、加载时间内存使用。...考虑到品牌形状,ATA将使用圆形图标,Biohack将使用尖锐图标,Codeland将使用填充图标。 Conclusion 在这篇文章,我解释了主题属性相应Material设计指南。

    2.5K20

    Toolbar-5.0新特性

    概念 Android5.0以后谷歌大力推崇Material Design设计,有意统一之前Android style风格乱象情况。...Toolbar,这是用来取代过去 actionbar 控件,而现在于 material design 也对之有一个统一名称:app bar,在未来 android app ,就以 toolbar...除此之外,在设计 Toolbar 时候,Google也留给了开发者很多可定制修改余地,这些可定制修改属性在官方API文档中都有详细介绍,如: 设置导航栏图标; 设置Applogo; 支持设置标题标题...---- Toolbar基本使用 ---- 使用V7向下兼容包 前面提到 Toolbar 是在 Android 5.0 才开始加上,Google 为了将这一设计向下兼容,自然也少不了要推出兼容版...---- 运行效果 按照效果图,从左到右分别是我们前面提及到 导航栏图标、Applogo、标题标题、自定义控件、以及 ActionMenu 。 ?

    45020

    android Material Design详解

    前言 我们都知道Marterial Design是Google推出全新UI设计规范,如果对其不太了解可以看下:Material design非官方中文指导手册 ,或者我前面几篇Material...在推出这门全新设计语言后,Android上自家应用很快就使用Material Design全新设计了,如Play商店,Google Map,Google+,比较新Inbox等;Web上视觉体验也是很...Material,最有帮助的当属这个了Material Design官方介绍了;IOS方面的Google应用也在慢慢推进。...所以作为一个Android开发者怎么能不紧跟Google步伐呢,下面就来通过ToolbarPalette这两个在API21后推出东西,当然Google已经把它们放到到v7库里了,使用Material...Design设计App当然不仅限于这两个方面了,前面的Material Design译文已经清楚知道怎么去全面设计

    2K90

    Android 沉浸式解析轮子使用

    是因为从 Android 6.0(API 23)开始,我们可以改状态栏绘制模式,可以显示白色或浅黑色内容图标(除了魅族手机,魅族自家有做源码更改,6.0 以下就能实现)。...1.2 Android5.0 以上设置状态栏背景颜色 Android 5.0 是一个里程碑式版本,从Android 5.0 开始,Google 推出了全新设计规范 Material Design,并且原生控件就可以实现一些炫酷...如果在开发时候是通过设置主题方式设置,则需要在values-v21文件夹下添加如下主题,达到兼容目的 <style name="Theme" parent="Theme.<em>Design</em>.Light.<em>NoActionBar</em>...1.3 <em>Android</em> 6.0 +实现状态栏字色<em>和</em><em>图标</em>浅黑色 <em>使用</em> <em>Android</em>6.0 以下版本沉浸式<em>的</em>时候会遇到一个问题,那就是 <em>Android</em> 系统状态栏<em>的</em>字色<em>和</em><em>图标</em><em>颜色</em>为白色,当状态栏<em>颜色</em>接近浅色<em>的</em>时候...并且还可以在<em>主题</em>中<em>使用</em>属性,并且该<em>主题</em>需要放在 values-v23 文件夹下相应 <em>Android</em>6.0 以上才能生效: <style name="Theme" parent="Theme.<em>Design</em>.Light.<em>NoActionBar</em>

    3.2K10

    通过来模仿稀土掘金个人页面的布局来学习使用CoordinatorLayout

    特别喜欢稀土掘金个人界面的样子,那我们就来看看如何实现这个效果吧,要想实现这个效果,肯定需要Material Design风格,那就需要学会使用以下控件:CoordinatorLayout,AppBarLayout...Toolbar 是在 Android 5.0 开始推出一个 Material Design 风格导航控件 ,Google 非常推荐大家使用 Toolbar 来作为Android客户端导航栏,以此来取代之前...除此之外,在设计 Toolbar 时候,Google也留给了开发者很多可定制修改余地,这些可定制修改属性在API文档中都有详细介绍,如: 设置导航栏图标; 设置Applogo; 支持设置标题标题...毫无疑问,TabLayout也是Material Design设计风格,当然也是5.0以后出来。...如果设计需求不要求选项卡在切换时附带有图标的切换效果,仅仅文字颜色发生变化以响应用户点击事件,那么TabLayoutViewPager建立联系可以用官方提供方法,它可以做到交互双向联动,也就是点击

    2.3K90

    Android构建Material Design应用详解

    为了解决这个问题,Google公司在2014年IO大会上推出了一套全新界面设计语言——Material Design(材料设计语言),这次Google在界面设计上确实下足了功夫,一个词,好看。...并且在2015年IO大会上推出了一个Design Support库,这个库将Material Design中最具代表性一些控件效果进行了封装,使得开发者在不了解Material Design情况下也可以轻松地将自己应用...:25.3.1' 我们使用Toolbar来替代ActionBar,因此需要指定一个不带ActionBar主题,通常有Theme.AppCompat.NoActionBar (深色) 主题或者Theme.AppCompat.Light.NoActionBar...-- 悬浮图标颜色,更多表达了一种强调意思,比如一些控件选中状态也会使用颜色 -- <item name="colorAccent" @color/colorAccent</item <...LinearLayout,它在内部做了很多滚动事件封装,并应用了一些 Material Design 设计理念,AppBarLayout 解决了 在 FrameLayout Toolbar 被遮挡问题

    1.1K10

    Android Material Design之Toolbar与Palette实践

    前言 我们都知道Marterial Design是Google推出全新UI设计规范,如果对其不太了解可以看下:Material design非官方中文指导手册 ,或者我前面几篇Material Design...在推出这门全新设计语言后,Android上自家应用很快就使用Material Design全新设计了,如Play商店,Google Map,Google+,比较新Inbox等;Web上视觉体验也是很...Material,最有帮助的当属这个了Material Design官方介绍了;IOS方面的Google应用也在慢慢推进。...所以作为一个Android开发者怎么能不紧跟Google步伐呢,下面就来通过ToolbarPalette这两个在API21后推出东西,当然Google已经把它们放到到v7库里了,使用Material...Design设计App当然不仅限于这两个方面了,前面的Material Design译文已经清楚知道怎么去全面设计

    1.3K80

    Material Design初露锋芒之复杂视图轻松实现

    为什么一定要学习Material Design? 许多程序员有这样疑问:现有的知识能满足工作需要了,为什么还要费劲去学习Material Design?...那么我可以告诉你,Material Design大大节约了UI上开发时间,而学会她(满足日常使用)只需花一点点功夫。...使用Material控件可以非常优雅地消灭各种问题,几乎不需要写任何逻辑代码。 如丝般顺滑,性能杠杠~往下继续查看要点解读。 ?...使用Martial Design优雅实现 要点解读 // 保存ViewPagerFragment状态 mViewPager.setOffscreenPageLimit(mFragments.size...再来喵一眼,顺便点个喜欢关注什么~~ ? Material Design各个控件�自动协调 相关链接 本文Demo 30分钟入门Android Material Design

    91020

    Flutte部件目录-Material Components 顶

    实现Material Design指南视觉,行为运动丰富小部件。 应用程序结构导航 按钮 输入选择 对话框,弹出框和面板 信息显示 布局 查看Flutter窗口小部件目录更多小部件。...一个显示在应用底部材质小部件,用于在少量视图中进行选择,通常介于3到5之间。 底部导航栏由文本标签,图标或两者多个项目组成,并放置在一块材料顶部。 它提供了应用程序顶级视图之间快速导航。...如果选择项目非空,则使用fixedColor呈现所选项目,否则将使用主题ThemeData.primaryColor。...FlatButton 平面按钮是在材料组件部件上打印部分,通过填充颜色对触摸作出反应。 ? IconButton 图标按钮是一个打印在材质小部件上图片,通过填充颜色(墨水)对触摸作出反应。 ?...SnackBar 带有可选操作轻量级消息,简要显示在屏幕底部。 ? 信息显示 Image 一个显示图像小部件。 ? Icon 材质设计图标。 ?

    9.5K40

    【软件开发规范七】《Android UI设计规范》

    Material Design相关 2.1 核心思想 2.2 材质与空间 2.3 动画 2.4 颜色 2.5 图标 2.6 图片 2.7 文字 字体 文字排版 2.8 布局 2.9 组件(Components...Material Design相关 Material Design,中文名:质感设计,是由 Google 推出全新设计语言,谷歌表示,这种设计语言旨在为手机、平板电脑、台式机“其他平台”提供更一致...编辑 Material Design 是最重视跨平台体验一套设计语言。由于规范严格细致,保证它在各个平台使用体验高度一致。...2.2 材质与空间 材质 ​编辑 Material Design ,最重要信息载体就是魔法纸片。纸片层叠、合并、分离,拥有现实厚度、惯性反馈,同时拥有液体一些特性,能够自由伸展变形。...,表面不要有图案 不能透视、弯曲 ** 小图标 ** 优先使用material design默认图标

    5.1K20

    最详细 Android Toolbar 开发实践总结

    初识 Toolbar Toolbar是在 Android 5.0 开始推出一个 Material Design 风格导航控件 ,Google 非常推荐大家使用 Toolbar 来作为Android客户端导航栏...除此之外,在设计 Toolbar 时候,Google也留给了开发者很多可定制修改余地,这些可定制修改属性在API文档中都有详细介绍,如: 设置导航栏图标; 设置Applogo; 支持设置标题标题...接下来,我们就一步一步来看如何使用 Toolbar (其实是我使用 Toolbar 踩坑填坑血泪史,你们接下去看,我先擦个眼泪…. )。...开始使用 Toolbar 前面提到 Toolbar 是在 Android 5.0 才开始加上,Google 为了将这一设计向下兼容,自然也少不了要推出兼容版 Toolbar 。...ToolbarActivity效果图 按照效果图,从左到右分别是我们前面提及到 导航栏图标 、 Applogo 、 标题标题 、 自定义控件 、以及 ActionMenu 。

    80520

    Android开发笔记(一百一十九)工具栏ToolBar

    Toolbar 在前面的博文《Android开发笔记(二十)顶部导航栏》,我们学习了ActionBar用法,可是ActionBar着实是不怎么好用,比如文字风格不能定制、图标不能定制,而且还存在低版本兼容性问题...为此,Android提供了加强版工具栏控件即Toolbar,因为Toolbar继承自ViewGroup,而且可在布局文件像其它布局视图一样使用,所以灵活性大大提高了。...setTitle : 设置标题文字。 setTitleTextAppearance : 设置标题文字风格。 setTitleTextColor : 设置标题文字颜色。...setSubtitleTextColor : 设置副标题文字颜色。 setNavigationIcon : 设置导航图标。导航图标工具栏图标左边。...有关原SearchView使用说明参见《Android开发笔记(二十)顶部导航栏》,新旧两个SearchView用法其实大同小异,当然新版功能会更强大些,下面是android.widget.SearchView

    1.9K30
    领券