文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Android常用技巧夜间模式开发浅析

前言 Android的夜间模式主要主用于阅读方面，在QQ，微信读书，新闻阅读类一般会有相应的功能，本文主要介绍整体APP的夜间模式以及webview中夜间模式的实现。 效果图展示 ? ?...功能实现简介 APP的夜间模式有两种方式： 1、通过切换theme来实现夜间模式。2、通过修改uiMode来切换夜间模式。...application夜间模式代码详解 首先记载依赖：compile 'com.android.support:appcompat-v7:24.0.0'，然后Activity须继承AppCompatActivity...attr/actionBarSize" android:background="@color/colorPrimary" android:fitsSystemWindows="true"...但是颜色值不一样，当点击切换夜间模式的时候，android会自动从values—night下面取值 还有一点需要注意：APP的主题一定要是DayNight下的 <style name="AppTheme

1.1K50

轻听变色之谜

轻听是一款小而美的Android本地音乐播放器，而它的特点之一就是拥有多彩的外衣，如下： 其中，左边6张是白天模式下的几种不同主题色的样式，右边是夜间模式。 那么轻听是如何实现变色的呢？...主要是结合以下两种方式： 自定义Style和Theme 动态配置主题色 自定义Style和Theme Style和Theme主要用来实现白天模式和夜间模式。...android:attr/textColorPrimary 在布局文件中是这样使用的： <TextView android:id="@+id/text_item_title...android:attr/textColorPrimary"/> 这样，当指定了Theme之后，就会去相应的Style下面取对应的颜色值，从而呈现出不同的色彩。...问题 Style和Theme的方式实现简单，非常适用于模式较为固定的场景，如白天模式和夜间模式。 但是，轻听在白天的模式的时候的基础之上还有几种不同的主题色。 简单聊一下主题色。

1.7K00
您找到你想要的搜索结果了吗？
是的
没有找到

简洁优雅地实现夜间模式

夜间模式作为APP的一个重要的用户体验之一，很多应用有这个功能，目前，用户体验也是产品和设计较为看重的方面，越来越值得深入探究，本文将介绍在Android上一种夜间模式的实现方式。 ?...前言 Android 6.0 Marshmallow 预览版中曾经短暂出现过相关的夜间模式的功能，只是在正式版中被移除了，在Android 7.0 Nougat上，用户们再次经历了「得而复失」的遗憾，在开发者预览版中...如何开启这项功能，可以参考少数派的这一篇文章，帮你找回 Android 7.0 夜间模式的 2 款应用（https://sspai.com/post/35273）。...2 新建夜间模式资源文件夹:在res目录下新建values-night文件夹，然后在此目录下新建colors.xml文件在夜间模式下的应用的资源。...android:attr/textColorPrimary,color:?attr/colorControlNormal等。 Q:为什么我的WebView颜色没有变化？

1.6K30

Android 10适配要点，深色主题

于是，许多应用程序为了能够让用户在光线昏暗的环境下更加舒适地使用，会在应用内部提供一个一键切换夜间模式的按钮。当用户开启了夜间模式，就会将应用程序的整体色调都调整成更加适合于夜间浏览的颜色。...而且重复操作的问题也很让人头疼，比如说我在一个应用中开启了夜间模式，在另外一个应用中还需要再开启一次，关闭夜间模式也需要进行同样重复的操作。...因此，一直以来都有强烈的呼声，希望Android能够在系统层面支持夜间模式功能。终于在Android 10.0系统中，Google引入了深色主题这一特性，从而让夜间模式正式成为了官方支持的功能。...比如说黑色的文字通常应该衬托在白色的背景下，反之白色的文字通常应该衬托在黑色的背景下，那么此时我们就可以使用主题属性来指定背景以及文字的颜色，示例写法如下： 这些主题属性会自动根据系统当前的主题模式选择最合适的颜色值呈现给用户，效果如下图所示。 ? ?

1.7K10

Android编程实现夜间模式的方法小结

本文实例讲述了Android编程实现夜间模式的方法。分享给大家供大家参考，具体如下： 随着APP实现的功能越来越丰富, 看小说看视频上网等等, 现在不少人花在手机平板等移动终端上的时间越来越长了....但手机和平板的屏幕并不像Kindle那类电纸书的水墨屏那么耐看, 由于自发光的屏幕特性, 我们长期盯着屏幕看容易眼睛酸痛疲倦, 因此各种护目模式, 夜间模式在移动APP上得到广泛应用, 这的确也是一个贴心的小功能...假设我们的应用界面是白色背景, 黑色文字, 夜间模式就是黑色背景, 灰白色的文字....这种夜间模式有别于第一种的调节亮度, 由于背景和内容文字可以随意的设置颜色和透明度, 这种夜间模式看起来更直观,也可以更舒服....(Theme), 比如默认主题和夜间主题, 默认主题中给activity_background属性设为白色, text_color属性设为黑色, 夜间主题则分别为黑色和灰白色.

73920

深色模式适配指南

Android 安卓在 Android 10（API 级别 29）及更高版本中提供深色主题背景，可以通过以下三种方法启用深色主题背景： 使用系统设置（Settings -> Display -> Theme...）启用深色主题背景 使用"快捷设置"图块，从通知托盘中切换主题背景（启用后） 在 Pixel 设备上，选择"省电模式"将同时启用深色主题背景，其他原始设备制造商 (OEM) 不一定支持这种行为 在应用中支持深色主题背景...dark) 的深色主题背景： 这会将应用的主要主题背景与系统控制的夜间模式标记相关联...android:attr/textColorPrimary 这是一种通用型文本颜色，它在浅色主题背景下接近于黑色，在深色主题背景下接近于白色，该颜色包含一个停用状态。 ?...attr/colorControlNormal 一种通用图标颜色，该颜色包含一个停用状态。 Flutter 这里以 Flutter 为例，简单介绍下跨平台开发框架如何适配深色模式。

2.7K31

Android 深色模式的项目应用

所有代码实践在云阅里可以看到： 下载App体验，酷安：云阅 直接查看源码，GitHub：CloudReader 项目实践 1.选定原生Api实现 Android官方深色主题背景开发文档(需科学上网...attr/actionBarSize" android:background="@color/colorToolBar" app:contentInsetStart="0.0dp"...android:attr/textColorPrimary 这是一种通用型文本颜色。它在浅色主题背景下接近于黑色，在深色主题背景下接近于白色。 ?...android:attr/textColorSecondary可作为第二文本颜色，相对于上面的颜色较浅。...5).在dialog打开后，再切换系统的深色模式，这时使用系统的颜色会不生效，需要使用自己的color文件里的颜色。具体出现在首次打开应用时，弹出的隐私弹框。

1.1K10

Android 10.0正在来的路上！

万众期待的黑暗模式来了 而在XDA的爆料中，这次Android Q最大的亮点就是官方终于响应了用户的请求，在系统层面上加入了全局夜间模式，也就是俗称的黑暗模式。...面对这一情况，许多APP都针对性的提供了夜间模式可供选择。通过更暗的背景、更低的亮度来让手机屏幕与环境的对比减弱，但APP只能管自己的一亩三分地，像通知栏、顶部信息栏、桌面等等在系统的管辖之下。...故而，让谷歌推出一个在全局条件下都能够适用的夜间模式，也就成为了用户的迫切需求。 ? 根据XDA的介绍，要启用黑暗模式，只需点击显示设置中的“设置黑暗模式”选项即可。...用户可以将黑暗主题设置为始终启用，也可以根据适用使用习惯在某个时间段自动启用。启用之后，包括设置、APP、桌面等元素都会在屏幕主体部分变成深灰色的色调，而通知栏等部分则是纯黑色。 ?...看到这里你估计会问了，为什么不全面使用#000000等级的纯黑色，要知道目前大量出现的OLED材质与LCD屏幕不同，在显示黑色的时候是不会发光的，此时屏幕耗电要比显示其他颜色时小很多，也更加节省电量，因此如果遇到这种屏幕

89950

对于Android日夜间模式实现的探讨

0x0001 ====== 关于 Android 的日间/夜间模式切换相信大家在平时使用 APP 的过程中都遇到过，比如知乎、简书中就有相关的模式切换。...在本篇文章中给出了三种实现日间/夜间模式切换的方案： 使用 setTheme 的方法让 Activity 重新设置主题； 设置 Android Support Library 中的 UiMode 来支持日间...之后根据不同的模式会去选择不同的 colors.xml 。在 Activity 调用 recreate() 之后，就实现了切换日/夜间模式的功能。 说了这么多，直接上代码。...我们在这里先规定一下：夜间模式的资源在命名上都要加上后缀 “_night” ，比如日间模式的背景色命名为 color_background ，那么相对应的夜间模式的背景资源就要命名为 color_background_night...看到这里，肯定有人会问，为什么要设置对应的 “_night” ？到底是通过什么方式来设置日/夜间模式的呢？

1.9K20

Scoops android app多主题架构（三）

白天夜间主题 很多应用都有这个功能，可以选择白天和夜间模式，给用户更好的体验。为此，系统也提供了一种机制，来实现此功能。 模式主要分为四种 夜间 白天 跟随系统 和自动。...具体实现可以去看com.android.support:appcompat-v7:23.0.0源码 夜间和白天模式很好理解。自动就是根据时间判断是否为白天和夜间，自动选择对应主题。...Scoops 1自定义一个属性Attrs.xml 这里可以看到定义了两个属性textColor和textSize 格式分别为color和dimension 2创建一个目录values-night 3在values...attr/textColor” 记住用的是?...attr来使用自定义的属性 6具体的结果，看Primary Color颜色变化 7代码地址： https://github.com/luxiaoming/ScoopsDemo

53870

优化夜间阅读体验 - 夜间模式设计通用方法

你有没有在夜间使用移动设备的习惯？你觉得QQ现有的夜间模式亮度在使用时是否舒适？...我们为什么要做夜间模式？ 1. 用户调研显示：57%的用户想要使用夜间模式，71.1%的用户习惯在夜间不开灯看手机 在ISUX北京调研小组的帮助下，我们针对移动端QQ界面夜间模式进行了调研。...结合夜间模式的需求，我们提出保证文字与背景色对比度在3:1-4.5:1范围,保证元素（头像，图片）与背景色的对比度在3:1-7:1的范围内。以此保证文字的清晰度，减少其他元素过亮的情况。...实际案例应用—QQ iPad版夜间模式设计 1 检测现有界面——不能满足夜间模式要求 依据5项原则去评价现有QQ  iPad版界面——白色版与黑色版，每个版本都有各自不能满足原则要求的地方。...设计方案场景应用 将方案1的设计扩展应用到 QQ iPad版、QQ Android 版和QQ iPhone版中，如下图所示： ? ? ?

1.5K30

DarkMode(1)：产品应用深色模式分析

为什么Dark Mode变得越来越流行 2018 年的 macOS Mojave 率先支持了深色外观，紧接着 Windows 10 在 2018 年的 10 月份大版本更新中，也引入了 Dark Mode...夜览模式让屏幕在晚上减少蓝光，帮助我们更好地睡眠； 隐式推送减少了各类通知打扰我们的次数，使手机不会频繁打断我们的注意力 虽然有许多 app 已经支持了夜间模式，但还远远不够。...让使用者沉浸于内容 将 Dark Mode 翻译为「夜间模式」，是因为前者的使用场景更广，因此使用「深色模式」这样的翻译更恰当。 黑色更有利于我们沉浸于内容本身，无论是生产内容还是消费内容。...这样，在显示黑色时，OLED 的屏幕像素只需要关闭，就是纯正的黑色了。 在 macOS 的深色模式中，基底色并不是纯黑，而是带有一定灰度的黑色。...在我们常见的说法中，就是自 iOS 7    中引入的毛玻璃效果，常用于系统的文件夹、下拉菜单、通知、Dock 栏等处。苹果为这些材质设计了深浅两套配色方案，并提供了从厚到薄的四种感观效果。

1.8K20

Android-日夜主题切换(google推荐)

android日夜间模式切换相比大家都接触过，我之前也经常用，但今天想给大家推荐一个google推荐的实现方式，实现起来比较简单，就是咱们今天的主角主题-----Theme.AppCompat.DayNight...image.png 聪明的小伙伴已经猜出来了，这value文件夹下的sytle是我们白天模式的style,而value-night下的sytle则是我们夜间模式的style.而value-night下color...文件夹则是我们定义的夜间模式的颜色信息，同样我们还可以定义其他相关的文件夹。...我们看一眼夜间模式我们定义的color颜色： ? image.png 没啥说的，也白天对应。...1.3 如何引用我们自定义theme的属性 控件引用我们自定义的属性的格式： android:需要修改的属性="?attr/属性名称" 如图： ?

3K30

打造自己的 APP「冰与火百科」（四）：WebView 交互、夜间模式

给大家介绍一下简单的 WebView 交互和夜间模式在「冰与火百科」中的实现。..., "text/html", "utf-8", null); 复制代码 这样就完成了一个简单的 JavaScript 和 Android 的交互，效果如下： image.png 夜间模式 关于夜间模式的实现...，主要是参考了 D_clock爱吃葱花 大神的这篇文章，简单说一下实现过程如下： 在 styles 中添加「DayTheme」和「NightTheme」两个主题； 在布局文件中使用类似 android:...attr/colorBackground" 来设置颜色，使其跟随当前主题颜色； 编写 DayNightHelper，利用 SharePreferences 保存、获取当前模式； 在页面 setContentView...getWindow().setStatusBarColor( ContextCompat.getColor(mContext, typedValue.resourceId)); } 复制代码 夜间模式的实现就到此

1.3K20

APP设计实例解析，深色模式为什么突然就火了？

苹果在2019年6月发布的iOS13中增加了“黑暗模式”，用户打开“黑暗模式”后，应用界面将会变为深色，随后Google Android 10的发布同样搭载“黑暗模式”。...为了适配系统，不少APP纷纷推出了深色模式。 使用OLED屏幕的设备，在纯黑色下可以有效降低耗能，进一步延长续航时间。除此之外，深色模式还可以有效解决OLED屏烧屏、费眼的问题。...除此之外，微信的彩色线型图标在黑色背景上也变得更具科技感，颜值提升了不少。 微信的深色模式除了可以帮助用户缓解夜间视力疲劳外，在白天使用也几乎没有障碍，总体来说，体验感觉较好。...QQ在切换夜间模式时，则采用了一个平滑的渐变过渡，让用户可以快速适应场景切换。...知乎在设计夜间模式时目标应该很明确，即只考虑用户在夜间的使用，因此整体色调都很暗，在强光环境下无法正常浏览。

1.4K30
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券