【有美女看】提升用户体验,你不得不知道的事儿——巧用全屏与沉浸式体验,让用户更舒心~

最近公司项目中要求写一个视频直播录像及视频观看的功能,额,就本能地去看了一波当下主流的一些视频类APP,发现在爱奇艺等播放器中,在播放视频的时候都是fullScreen的,而这个在各大手游中也体现的比较多。

额,这个其实不算技术层次,但是为了我们的用户体验,我们不能不把每一个细节都做好,同时,这也是追妹秘诀哦~

于是楼主就采用了爱奇艺这样的设计风格,打算隐去系统标题栏和ActionBar。这里就跟大家分享一下这个如何实现,大家可以根据情况采纳。

1)首先我们来看看简单的一张图片是怎样显示的。代码很简单,我们只对Xml上放一张大图。

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout
 3     xmlns:android="http://schemas.android.com/apk/res/android"
 4     xmlns:tools="http://schemas.android.com/tools"
 5     android:layout_width="match_parent"
 6     android:layout_height="match_parent"
 7     tools:context="com.example.nanchen.fullscreendemo.MainActivity">
 8
 9     <ImageView
10         android:layout_width="match_parent"
11         android:layout_height="match_parent"
12         android:scaleType="centerCrop"
13         android:src="@drawable/test"/>
14 </RelativeLayout>

额,显示就很常规啦。

2)咳咳!搞什么飞机,我只想看美女,给我那么多我不需要的东西做什么?好嘛,来实现全屏,隐去系统标题栏,简单一句代码。

1 @Override
2     protected void onCreate(Bundle savedInstanceState) {
3         super.onCreate(savedInstanceState);
4         setContentView(R.layout.activity_main);
5
6         //   实现全屏,去掉系统标题栏,适合于游戏、电影等沉浸式体验
7         getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN);
8 }

运行一下:

3)咳咳,别把时间给弄丢了呀,我想像饿了么一样还要看到时间。哼,要是看美女看久了,没注意时间被媳妇儿发现了可就不好了。

好嘛,那就把系统时间放出来嘛,其实也很简单啦,但是目前只支持SDK在21以上哦。下面两种方式都可以。

1 if (VERSION.SDK_INT >= 21) {
2             getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
3                     | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
4             getWindow().setStatusBarColor(Color.TRANSPARENT);
5         }
 1         //另外一种方式
 2         if (VERSION.SDK_INT >= 21) {
 3             getWindow().getDecorView().setSystemUiVisibility(
 4                     View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
 5                             | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
 6                             | View.SYSTEM_UI_FLAG_LAYOUT_STABLE
 7             );
 8             getWindow().setStatusBarColor(Color.TRANSPARENT);
 9             getWindow().setNavigationBarColor(Color.TRANSPARENT);
10         }

看看效果。

4)哎,要是可以想看的时候显示,不想看的时候隐藏就好了。

也可以呀。

1 getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
2         | View.SYSTEM_UI_FLAG_FULLSCREEN);

运行。

小伙伴也许会想:靠,楼主你这什么审美,这一闪一闪的是啥?这样还不如上一个好,简直是影响我看美女的心情。哎,关了关了。谁会这么脑残这样弄。

5)话说心急吃不了热豆腐,我亲爱的小伙伴你别方,我们还没带来重磅呢,app的沉浸式用户体验!!!

为了实现出沉浸式效果,隐去不必要的系统控件影响我们的即视感,但是小伙伴,你酌情使用,毕竟沉浸式体验除了在电影,手游,在其他行业貌似还用的相对较少,不过不管用不用,你还是先收藏一个呗,实现就简单了,重写onWindowFocusChanged方法。

 1 /**
 2      * 真正的沉浸式体验,适用于SDK>=19
 3      * 可以拉出导航栏
 4      */
 5     @Override
 6     public void onWindowFocusChanged(boolean hasFocus) {
 7         super.onWindowFocusChanged(hasFocus);
 8         if (hasFocus && VERSION.SDK_INT >= 19) {
 9             getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE
10                     | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
11                     | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
12                     | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
13                     | View.SYSTEM_UI_FLAG_FULLSCREEN
14                     | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY
15             );
16         }
17     }

见证奇迹:小伙伴一定会发现,这个一下拉就可以把系统导航栏弄出来,又不影响体验,又没影响美观,这也是真正的沉浸式体验。

额,喜欢的小伙伴,就动动你的小手点个赞吧,我们在码农之余,美女还是不可少矣!

转载的小伙伴请在醒目位置附上本文链接:http://www.cnblogs.com/liushilin/p/5799381.html

时间: 2024-10-10 17:52:33

【有美女看】提升用户体验,你不得不知道的事儿——巧用全屏与沉浸式体验,让用户更舒心~的相关文章

第六章 大数据,6.3 突破传统,4k大屏的沉浸式体验(作者: 彦川、小丛)

6.3 突破传统,4k大屏的沉浸式体验 前言 能够在 4K 的页面上表演,对设计师和前端开发来说,即是机会也是挑战,我们可以有更大的空间设计宏观的场景,炫酷的转场,让观众感受影院式视觉体验,但是,又必须面对因为画布变大带来的性能问题,以及绞尽脑汁实现很多天马行空的的想法.下面是这次双11媒体大屏开发中我们的一些设计和思路. 1. 3D动感跑道 当逍遥子零点倒数5,4,3,2,1,0!激昂音乐奏起,媒体中心大屏幕跳跃出一个动感十足的页面,黄橙橙的 GMV 数字蹭蹭往上长,跳跃的翻牌器下有个不断向前

Android如何实现超级棒的沉浸式体验

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由brzhang发表于云+社区专栏 做APP开发的过程中,有很多时候,我们需要实现类似于下面这种沉浸式的体验. 沉浸式体验 一开始接触的时候,似乎大家都会觉这种体验实现起来,会比较困难.难点在于: 头部的背景图在推上去的过程中,慢慢的变得不可见了,整个区域的颜色变成的暗黑色,然后标题出现了. StatusBar变的透明,且空间可以被利用起来,看我们的图片就顶到了顶 了. 我们的viewpager推到actionbar的下方的时候,就

提升用户体验,你不得不知道的事儿——三种提醒框的微技巧

大家都知道无论是android开发还是其他的开发,用户的体验都是很重要的事儿,下面就android开发中的三种提醒方式,Toast,SnackBar,Dialog做一些细节上的处理,或许能让你的产品更有用户亲和力. 1)Toast Toast是一个轻量级的提醒框,相信各位小伙伴,肯定在平时开发中用到地方堪称最多,使用方式非常简单,简单的一句代码搞定. 1 Toast.makeText(this,"This is a toast...",Toast.LENGTH_SHORT).show(

Botanical Dimensions:借助第九代智能英特尔&#174; 酷睿? 处理器实现独特沉浸式体验

本文介绍位于洛杉矶的互动体验设计工作室 Master of Shapes (MOS) 打造 Botanical Dimensions 时所做出的技术努力.在这种互动式多世界体验中,参与者将穿越丛林,寻找通往另一时空的隐藏之门.用户通过控制器控制穿越多个世界的飞行模式,并在 360 空间音频的伴随下遇到各种生动鲜活.此起彼伏的外星植物.一起来看看吧! 原文地址:https://www.cnblogs.com/IDZPRC/p/10876286.html

和我一起看API(一)你所不知道的LinearLayout

楼主英语水平差,翻译的不好的话请多多指正,嘿嘿... A Layout that arranges its children in a single column or a single row. The direction of* the row canbe set by calling {@link #setOrientation(int) setOrientation()}.* You can also specify gravity, which specifies thealignme

沉浸式-体验

1.values-21 (5.0+)以上: 图1 图2 2.代码中修改状态栏: 3.获得状态栏高度: 图 1 图 2 4.效果图: 原文地址:https://www.cnblogs.com/jeffery336699/p/9292187.html

沉浸式Web初体验

沉浸就是让人专注在当前的情境下感到愉悦和满足,而忘记真实世界的情境.心流理论能有力解释人们废寝忘食地投入一件事情的状态. 心流理论的核心就是说当人的技能与挑战最佳匹配时能达到心流状态.比如玩一个游戏,如果游戏太难,游戏者会感到焦虑:如果游戏太容易,游戏者会感到无聊:当游戏者觉得有能力挑战游戏时,才会投入地玩游戏. 通过怎样的方式才能达到沉浸式体验呢?一个是通过感官体验,比如座过山车,一个是通过认知体验,比如玩游戏,而同时包含丰富感官.认知体验时就极有可能创造最佳的心流状态. 当用户会花较长时间并

MirrorSys:沉浸式现实是一种怎样的体验?

文/James Begole博士 倘若你曾被一部小说的情节深深吸引,可能你并不需要任何视觉细节来说服你深信不疑,因为故事本身便会让你身临其境.视频游戏也如此,例如Minecraft(我的世界)这款采用低保真数据块的视频游戏引人入胜,其带来的体验并不亚于最先进的.具有照片般画面质量的游戏.低保真手机游戏已经深深地打入高保真游戏机市场,其主要原因就是人们可以随时随地酣畅淋漓地沉浸到游戏当中.然而,研究表明,视觉和听觉细节的确会影响我们对现实的感知,让我们对现实更加深信不疑:与此同时,逼真的视觉及听觉

Android UI体验之全屏沉浸式透明状态栏效果

前言: Android 4.4之后谷歌提供了沉浸式全屏体验, 在沉浸式全屏模式下, 状态栏. 虚拟按键动态隐藏, 应用可以使用完整的屏幕空间, 按照 Google 的说法, 给用户一种 身临其境 的体验.而Android 5.0之后谷歌又提出了 ColorPalette 的概念,让开发者可以自己设定系统区域的颜色,使整个 App 的颜色风格和系统的颜色风格保持统一.今天学习总结一下如何实现Android 4.4以上全屏沉浸式透明状态栏效果.先看下预期效果: 首先现分清楚哪部分是状态栏,哪部分是导