style: {

   height: 100,

   textAlign: 'center',

   textAlignVertical: 'center',

 }

以上方法在Android上显示水平垂直居中， 但在IOS上只能水平居中, 方法是在IOS上添加lineHeight: 100, 如下

 style: {

   height: 100,

   textAlign: 'center',

   textAlignVertical: 'center',

   ...Platform.select({

      ios: { lineHeight: 100},

      android: {}

    })

 }

别忘了在react-native模块中导入组件 StyleSheet和Platform

React-Native组件之Text内文字垂直居中方案的更多相关文章

  1. React Native组件之Text

    React Native组件之Text相当于iOS中的UILabel. 其基本属性如下: /** * Sample React Native App * https://github.com/face ...

  2. React Native组件（三）Text组件解析

    相关文章 React Native探索系列 React Native组件系列 前言 此前介绍了最基本的View组件,接下来就是最常用的Text组件,对于Text组件的一些常用属性,这篇文章会给出简单的 ...

  3. React Native组件解析(二)之Text

    React Native组件解析(二)之Text 1. 概述 Text组件对应于iOS的UILabel,Android的TextView,用来显示文本.但是Text组件的内部使用的并不是flexbox ...

  4. beeshell —— 开源的 React Native 组件库

    介绍 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...

  5. React Native组件之Switch和Picker和Slide

    React Native组件Switch类似于iOS中的UISwitch:组件Slide类似于iOS中UIslider,组件Picker类似于iOS的UIPickerView.他们的使用方法和相关属性 ...

  6. React Native 组件之TextInput

    React Native 组件之TextInput类似于iOS中的UITextView或者UITextField,是作为一个文字输入的组件,下面的TextInput的用法和相关属性. /** * Sa ...

  7. react native组件的生命周期

    react native组件的生命周期 一.当页面第一次加载时,会依次调用: constructor() componentWillMount(): 这个函数调用时机是在组件创建,并初始化了状态之后, ...

  8. react native组件的创建

    react native组件的创建 react文件加载顺序: react项目启动后,先加载index.js.在index.js中可以指向首页. import { AppRegistry } from ...

  9. React Native组件（二）View组件解析

    相关文章 React Native探索系列 React Native组件系列 前言 了解了RN的组件的生命周期后,我们接着来学习RN的具体的组件.View组件是最基本的组件,也是首先要掌握的组件,这一 ...

随机推荐

  1. SQLServer 查询数据死锁语句

    SQLServer 查询数据死锁语句   我们可以通过以下SQL 语句用来查询,当前数据中存在的死锁语句,定位数据库出现死锁的根本原因.   --每秒死锁数量 SELECT * FROM sys.dm ...

  2. es6/ts for in/ for of

    for in 是es6之前就有的循环下标的方式 for of 是typescript的循环对象或者数组中值的方式,但是不能循环普通的对象,需要通过和Object.keys()搭配使用,如果循环普通对象 ...

  3. Vue SSR配合Java的Javascript引擎j2v8实现服务端渲染1概述

    原文地址 http://www.terwergreen.com/post/vue-ssr-j2v8-1.html 初步实现方案探索(Node环境) // 第 1 步:创建一个 Vue 实例 const ...

  4. ajax post get

    1.Ajax   post 方法 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind=&qu ...

  5. [centos][ntp][administrator] chrony ntp

    以下内容,适用于 CentOS 7 (systemd 体系) 一. 首先,确认你是否启用了 ntp 服务: [root@nlb2-liantiao ~]# timedatectl Local time ...

  6. 这就是使用ReportBuilder最简单的例子

    用这组控件最简单的例子:在窗体上放上组件名为ppBDEPipeline1,ppReport1,ppDesigner1,ppViewer1,DataSource1的控件,设置ppreport1的data ...

  7. day5_递归调用

    #递归的意思,函数自己调用自己#递归最多递归999次#递归的效率没有循环高 实例1-递归调用: count = 0 def say(): global count count += 1 print(' ...

  8. java 集合（三）List接口

    package cn.sasa.demo1; import java.util.ArrayList; import java.util.LinkedList; import java.util.Lis ...

  9. 洛谷P3237 米特运输 [HNOI2014] hash/二进制分解

    正解:hash/二进制分解 解题报告: 传送门! umm首先提取下题意趴QAQ 大概是说给一棵树,每个点有一个权值,要求修改一些点的权值,使得同一个父亲的儿子权值相同,且父亲的权值必须是所有儿子权值之 ...

  10. Could not autowire. No beans of 'TbItemMapper' type found. less... (Ctrl+F1) Checks autowiring prob

    Intellij Idea开发工具在@Autowired或者@Resource注入XxxMapper接口时报如下错误: Could not autowire. No beans of 'TbItemM ...