React Native 实现 类似京东 的 沉浸式状态栏和搜索栏

其原理其实就是在要 隐藏 部分的那个View 前面加入 StatusBar 代码!

代码如下:

<StatusBar
animated={true} //指定状态栏的变化是否应以动画形式呈现。目前支持这几种样式:backgroundColor, barStyle和hidden
hidden={false} //是否隐藏状态栏。
backgroundColor={'transparent'} //状态栏的背景色
translucent={true} //指定状态栏是否透明。设置为true时,应用会在状态栏之下绘制(即所谓“沉浸式”——被状态栏遮住一部分)。常和带有半透明背景色的状态栏搭配使用。
barStyle={'light-content'} // enum('default', 'light-content', 'dark-content')
>
</StatusBar>

本博客地址: wukong1688

本文原文地址:https://www.cnblogs.com/wukong1688/p/10888943.html

转载请著名出处!谢谢~~

[RN] React Native 实现 类似京东 的 沉浸式状态栏和搜索栏的更多相关文章

  1. [RN] React Native 实现 类似QQ 登陆页面

    [RN] React Native 实现 类似QQ 登陆页面 一.主页index.js 项目目录下index.js /** * @format */ import {AppRegistry} from ...

  2. [RN] React Native 下实现底部标签(支持滑动切换)

    上一篇文章 [RN] React Native 下实现底部标签(不支持滑动切换) 总结了不支持滑动切换的方法,此篇文章总结出 支持滑动 的方法 准备工作之类的,跟上文类似,大家可点击上文查看相关内容. ...

  3. [RN] React Native 实现图片预览

    [RN] React Native 实现图片预览 效果预览: 代码如下: 'use strict'; import React, {Component} from 'react'; import {I ...

  4. [RN] React Native 常见基本问题归纳总结

    [RN] React Native  常见基本问题归纳总结 本问题总结涉及到版本为: "react": "16.8.3","react-native& ...

  5. [RN] React Native 关闭所有黄色警告

    [RN] React Native 关闭所有黄色警告 console.ignoredYellowBox = ['Warning: BackAndroid is deprecated. Please u ...

  6. [RN] React Native 幻灯片效果 Banner

    [RN] React Native 幻灯片效果 Banner 1.定义Banner import React, {Component} from 'react'; import {Image, Scr ...

  7. [RN] React Native 常用命令行

    [RN] React Native 常用命令行 1.查看当前版本 react-native --version 或 react-native -v 2.创建指定版本的React Native项目 1) ...

  8. 81.Android之沉浸式状态栏攻略

    转载:http://blog.csdn.net/lmj623565791/article/details/48649563/ 一.概述 近期注意到QQ新版使用了沉浸式状态栏,ok,先声明一下:本篇博客 ...

  9. Android 沉浸式状态栏攻略 让你的状态栏变色吧

    转载请标明出处: http://blog.csdn.net/lmj623565791/article/details/48649563: 本文出自:[张鸿洋的博客] 一.概述 近期注意到QQ新版使用了 ...

随机推荐

  1. - Git常用命令 基础 总结 MD

    目录 目录 Git常用命令 帮助 help 常用操作 初始化 clone init 提交 push 暂存 更新 撤销修改 分支 branch 查看分支 创建分支 切换分支 checkout 删除分支 ...

  2. javascript中五种迭代方法实例

    温习一下js中的迭代方法. <script type="text/javascript"> var arr = [1, 2, 3, 4, 5, 4, 3, 2, 1]; ...

  3. java基础 接口私有方法

    /** * 问题描述: * 我们需要抽取一个共有方法,用来解决两个默认方法之间重复代码的问题 * 但是这个共有方法不应该让实现类使用,应该是私有化的. * * 解决方案: * 从java 9开始,接口 ...

  4. SQL Server中查找包含某个文本的存储过程 SQL 查找存储过程中出现过的文字怎么查询 查询整个数据库中出现的文本 sql 全局搜索

    --将text替换成你要查找的内容SELECT name, *FROM sysobjects o, syscomments sWHERE o.id = s.id AND text LIKE '%tex ...

  5. python爬虫---详解爬虫分类,HTTP和HTTPS的区别,证书加密,反爬机制和反反爬策略,requests模块的使用,常见的问题

    python爬虫---详解爬虫分类,HTTP和HTTPS的区别,证书加密,反爬机制和反反爬策略,requests模块的使用,常见的问题 一丶爬虫概述       通过编写程序'模拟浏览器'上网,然后通 ...

  6. delphi安装控件

    设置路径,要不就自己把文件copy到对应的文件夹里面再给你装一下装控件的 http://www.cppfans.com/vclcontrol.asp有关 VCL 控件的常见问题 (安装.卸载.升级BC ...

  7. python绘图 转

    Python有很多可视化工具,本篇只介绍Matplotlib. Matplotlib是一种2D的绘图库,它可以支持硬拷贝和跨系统的交互,它可以在Python脚本.IPython的交互环境下.Web应用 ...

  8. Django 之瀑布流实现

    需求分析 现在是 "图片为王"的时代,在浏览一些网站时,经常会看到类似于这种满屏都是图片.图片大小不一,却按空间排列,就这是瀑布流布局. 以瀑布流形式布局,从数据库中取出图片 每次 ...

  9. Django 之restfromwork 源码---APIView 分析

    Django 之 djangorestframework的APIView分析 APIView 类中的as_view() 方法 首先 我们从视图函数入手,在urls.py 中的 URLconfig中添加 ...

  10. python url合并与分离

     #!/bin/python3 from urllib import parse parse.urlsplit() 将url分为6个部分,返回一个包含6个字符串项目的元组:协议.位置.路径.参数.查询 ...