美文网首页
ReactNative各种样式设置的属性

ReactNative各种样式设置的属性

作者: 王大碗要努力 | 来源:发表于2017-08-10 17:50 被阅读0次

一、ImageView

1、设置图片的显示方式

resizeMode enum('cover', 'contain', 'stretch', 'repeat', 'center') 

决定当组件尺寸和图片尺寸不成比例的时候如何调整图片的大小。

cover: 在保持图片宽高比的前提下缩放图片,直到宽度和高度都大于等于容器视图的尺寸(如果容器有padding内衬的话,则相应减去)。译注:这样图片完全覆盖甚至超出容器,容器中不留任何空白。

contain: 在保持图片宽高比的前提下缩放图片,直到宽度和高度都小于等于容器视图的尺寸(如果容器有padding内衬的话,则相应减去)。译注:这样图片完全被包裹在容器中,容器中可能留有空白

stretch: 拉伸图片且不维持宽高比,直到宽高都刚好填满容器。

repeat: 重复平铺图片直到填满容器。图片会维持原始尺寸。仅iOS可用。

center:居中不拉伸。

属性:
accessible:表示此视图时一个启用了无障碍功能的元素。默认为true
onMagicTap:当accessible为true时,双击View会调用此函数。
onMoveShouldSetResponder:触摸控件并滑动时调用的方法
onMoveShouldSetResponderCapture:触摸控件并滑动时调用的方法,避免子视图响应
onResponderMove:用户在View上移动手指调用
onResponderRelease:结束触摸时调用
pointerEvents:控制当前视图是否可以触控'box-none', 'none', 'box-only', 'auto'

二、View

属性:
accessible:表示此视图时一个启用了无障碍功能的元素。默认为true
onMagicTap:当accessible为true时,双击View会调用此函数。
onMoveShouldSetResponder:触摸控件并滑动时调用的方法
onMoveShouldSetResponderCapture:触摸控件并滑动时调用的方法,避免子视图响应
onResponderMove:用户在View上移动手指调用
onResponderRelease:结束触摸时调用
pointerEvents:控制当前视图是否可以触控'box-none', 'none', 'box-only', 'auto'

样式:
width:宽度
height:高度
backgroundColor:背景颜色
backfaceVisibility:是否显示翻转'visible','hidden'
borderColor:边框颜色
borderWidth:边框宽度
borderRadius:边框圆角半径
borderStyle:边框样式'solid'实线,'dotted'点, 'dashed'虚线
borderTopColor:上边框颜色
borderTopWidth:上边框宽度
borderTopLeftRadius:左上角边框圆角的半径
borderTopRightRadius:右上角边框圆角的半径
overflow:内容超过容器时超出显示还是隐藏'visible', 'hidden'
opacity:透明度

相关文章

  • ReactNative各种样式设置的属性

    一、ImageView 1、设置图片的显示方式 决定当组件尺寸和图片尺寸不成比例的时候如何调整图片的大小。 cov...

  • jQuery 属性、样式操作

    1、属性操作 获取属性 设置属性 删除属性 2、样式操作 获取属性 设置属性 追加样式 移除样式 切换样式

  • CSS基础语法一

    CSS基本语法 CSS样式 内联样式(行内样式) 当行代码设置属性 页内样式 当先页面设置属性 外部样式 在单独的...

  • (9)打鸡儿教你Vue.js

    样式绑定 设置元素的样式用 v-bind 来设置样式属性class 与 style 是 HTML 元素的属性 v-...

  • word公式样式

    1 打开word里的标尺 2 创建新的样式 设置样式属性,按照图中设置好属性。 选择格式-> 制表符。1)设置...

  • ReactNative学习笔记4

    样式 原文地址,原文地址2,本文为原文不完全翻译在ReactNative,是通过使用JavaScript来设置样式...

  • CSS-1

    全局样式 类样式 背景样式 外部样式 文本样式 属性属性值作用color表示颜色的内容设置文本颜色directio...

  • CSS常用样式

    文字属性控制字体设置文本格式 边框 边界 列表符号属性 背景样式 连接属性 a 鼠标光标样式 边框基本样式属性 边...

  • jQuery操作样式与属性

    jQuery操作样式 css操作 功能:设置或者修改样式,操作的是style属性 操作单个样式 设置多个样式 获取...

  • jQuery 样式操作

    jQuery 样式操作 1、基本样式操作 设置样式属性操作 获取样式属性操作 2、类样式操作 添加类样式 移除类样...

网友评论

      本文标题:ReactNative各种样式设置的属性

      本文链接:https://www.haomeiwen.com/subject/ulzhrxtx.html