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. C++之拷贝控制 (Copy Control)

    只有2种成员 值成员: 指针成员: 依实现可分为raw pointer / shared_ptr; 现在,仅考虑第③种:资源对象共享 角度来考虑拷贝控制 类的两种语义:值语义.似指针 编译器提供的de ...

  2. Python3.x--33个保留字

    查询方法也在下图:

  3. python爬虫---单线程+多任务的异步协程,selenium爬虫模块的使用

    python爬虫---单线程+多任务的异步协程,selenium爬虫模块的使用 一丶单线程+多任务的异步协程 特殊函数 # 如果一个函数的定义被async修饰后,则该函数就是一个特殊的函数 async ...

  4. tomcat添加https服务

    系统环境: centos6.7 jdk-7u79-linux-x64 apache-tomcat-7.0.57 apr-1.5.2 apr-util-1.5.4 一.tomcat安装 自己准备tomc ...

  5. Matlab享元模式

    享元模式(Flyweight)通过共享技术实现相同或相似对象的重用,可以减少创建对象的数量,以减少内存占用和提高性能.Java String的常量池,python logging,线程池,数据库连接池 ...

  6. JavaWeb第三天--JavaScript

    JavaScript 1. JavaScript概述 1.1 JavaScript是什么?有什么作用? HTML:就是用来写网页的.(人的身体) CSS:就是用来美化页面的.(人的衣服) JavaSc ...

  7. Csharp 基础笔记知识点整理

    /* * @version: V.1.0.0.1 * @Author: fenggang * @Date: 2019-06-16 21:26:59 * @LastEditors: fenggang * ...

  8. echarts 3D地球实现自动旋转

    素材已上传至https://gitee.com/i1520/echarts3DEarth.git     https://github.com/i1520/echarts3DEarth 1.引入js文 ...

  9. MYSQL使用mysqldump导出表的部分数据

    MySQLdump是MySQL自带的导出数据工具,通常我们用它来导出MySQL中,但是有时候我们需要导出MySQL数据库中某个表的部分数据,这时该怎么办呢? mysqldump命令中带有一个 --wh ...

  10. Hadoop的伪分布式的安装

    查看下载地址:http://archive.cloudera.com/cdh5/cdh/5/hadoop-2.6.0-cdh5.4.0-src.tar.gz 解压hadoop-2.6.0-cdh5.4 ...