自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

翻译 React Native 之 动画

流动,有意义的动画移动对用户体验至关重要。喜欢ReactNative一切,动画api目前处于开发阶段,但已经开始合并两个互补的系统:LayoutAnimation动画——整个布局的事务,支持更细粒度的动画和交互式控制特定的值。Animated动画库的目的是使它以一种非常高性能的方式很容易简明地表达各种各样的有趣的动画和交互模式。动画注重陈述性输入和输出之间的关系,具有可配置之间的转换,和简单的启动/

2016-11-14 09:58:09 383

翻译 ReactNative 之 Handling Touches

用户主要通过触摸操作移动应用程序。他们可以使用手势的组合,比如点击一个按钮,地图上的滚动列表,或缩放。React Native提供了组件来处理常见的手势,比如每次点击、滑动,以及综合的手势响应器系统,以便识别更高级的手势。Tappable组件当你想捕获点击手势,您可以使用“Touchable”组件。他们把一个函数通过onPress props(调用触摸开始和结束的范围内组件)。 例如:class

2016-11-14 09:45:17 290

翻译 React Native 之 Images

静态图像资源0.14版本,React Native提供了一种统一的方式管理图片在你的iOS和Android应用程序。向应用程序添加一个静态图像,把它在添加源代码树中、参考如下:<Image source={require('./my-icon.png')} />图片的名字重复的解决方式如解决JS模块解决一样。在上面的示例中packager将寻找图标my-icon.png在同一文件夹组件需要它。如果你

2016-11-08 10:39:04 575

翻译 React Native 之 颜色

支持以下格式:‘#f0f’ (#rgb)‘#f0fc’ (#rgba)‘#ff00ff’ (#rrggbb)‘#ff00ff00’ (#rrggbbaa)‘rgb(255, 255, 255)’‘rgba(255, 255, 255, 1.0)’‘hsl(360, 100%, 100%)’‘hsla(360, 100%, 100%, 1.0)’‘transparent’‘red’

2016-11-08 09:07:31 1410

翻译 与现有的应用程序集成

本节将很快更新显示集成到更真实应用程序,如2048年的应用程序是用于objective - c和Swift。关键概念ReactNative是伟大的,当你从头开始一个新的手机应用程序。然而,它也适用于添加单一视图或用户对现有的native 应用程序。通过几个步骤,您可以添加新的ReactNative基础功能,屏幕、观点等。React Native的关键组件集成到你的Android应用程序:了解 Re

2016-11-07 14:34:36 575

翻译 React Native 之 More Resources

如果你仅仅阅读这个网站,您应该能够构建一个相当酷的rn app。但rn不仅仅是一家公司的一个产品——成千上万的开发者社区。如果你对rn感兴趣,这里有一些相关材料、你可以看看。Popular Libraries如果您正在React Native,你可能已经知道的React 。所以我觉得提及这个有点愚蠢。但如果你还没有,看看React ,这是最好的方法来构建一个现代的网站。一个常见的问题是如何React

2016-11-07 09:38:45 262

翻译 React Native 之 Using Navigators

移动应用程序很少由只是一个屏幕。一旦你第二个屏幕添加到您的应用程序,你需要考虑用户如何从一个屏幕导航到另一个。您可以使用导航器来过渡多个屏幕。这些过渡可以左右典型动画主/明细 堆栈,或垂直模态弹出窗口。NavigatorReactNative有几个内置导航组件,但是对于你的第一个应用程序您可能会希望使用导航器。它提供了一个JavaScript实现导航堆栈,因此它适用定制iOS和Android。Wor

2016-11-04 15:57:39 274

翻译 React Native 之 Networking

许多移动应用需要从远程URL加载资源。你可能想要一个POST请求 一个REST API,或者你可能只需要获取一块静态内容从另一个服务器。Using Fetch为了满足您的网络需求 RN 提供 Fetch API 。Fetch类似你之前使用过XMLHttpRequest或其他网络API ,你可以参考MDN指南使用Fetch更多信息。Making requests为了从任意URL获取内容,只是通过URL

2016-11-04 14:41:44 510

翻译 React Native 之 Using a ListView

ListView组件显示垂直滚动列表,但类似的结构,数据。ListView适用于长列表的数据,项目的数量可能随时间改变。和Scrollview不同,ListView只render显示在屏幕上元素,并不是所有的元素。ListView组件需要两个props:数据源和renderRow。数据源是信息的来源列表。renderRow从数据源取一条数据并返回一个格式化的组件来render(呈现)。这个示例创建了

2016-11-04 14:07:17 216

翻译 React Native 之 Using a ScrollView

滚动视图是一个通用托管多个组件和视图滚动容器。可滚动的项目不需要同类,你可以滚动垂直和水平(通过设置horizontal 属性)。这个示例创建了一个图像和文本混合在一起的垂直滚动视图。import React, { Component } from 'react';import { AppRegistry, ScrollView, Image, Text } from 'react-native'

2016-11-02 16:14:45 283

翻译 React Native 之 Handling Text Input

TextInput是一个基本组件,允许用户输入文本。它有一个onChangeText prop ,当文本改变调用的函数,每次文本提交时调用onSubmitEditing prop 。import React, { Component } from 'react';import { AppRegistry, Text, TextInput, View } from 'react-native';cl

2016-11-02 14:20:36 289

翻译 React Native 之 Layout with Flexbox

一个组件可以指定其孩子使用flexbox算法的布局。Flexbox旨在不同的屏幕尺寸提供一个一致的布局。您通常使用flexDirection、alignItems,justifyContent实现正确的布局。Flexbox在RN工作与CSS在web工作方式相同,有少数例外。默认值是不同的,与flexDirection影响列而不是行,alignItems影响伸展而不是flex-start,flex参数

2016-11-02 14:03:43 303

翻译 React Native 之 width与height

组件的高度和宽度确定它在屏幕上的大小。Fixed Dimensions 最简单的方法来设置组件的尺寸是通过添加一个固定的宽度和高度的风格。所有维度在RN没有单位,代表密度独立像素。import React, { Component } from 'react';import { AppRegistry, View } from 'react-native';class FixedDimension

2016-11-02 11:23:38 727

翻译 React Native 之 Style

在RN中,你不需要使用一个特殊的语言或语法定义样式style。你只需要使用JavaScript定义你的应用程序风格。所有的核心组件接受指定样式style。在网站上样式名称和值通常匹配CSS是如何工作的,除了名字的书写,像backgroundColor而不是像background-color。style prop可以是一个普通的JavaScript对象。这是最简单的,我们通常使用示例代码的地方。您还可

2016-11-02 10:48:38 436

翻译 React Native 之 State

有两种类型的数据控制组件:props和state。props被父类设置,他们在组件的生命周期是固定的。要改变的数据,我们必须使用state。一般来说,应该在构造函数中初始化state ,然后调用setState 改变它。例如,假设我们想要文本闪烁。一旦当闪烁的组件被创建文本本身被设置,所以文本本身是一个prop。“文本是否打开或关闭“随着时间的推移改变,所以应该保存在state。import Rea

2016-11-02 10:17:10 333

翻译 React Native 之 Props

大多数组件可以定制创建时,使用不同的参数。这些创建参数被称为Props(道具)。例如,基本RN组件的image。当你创建一个image的时候,你可以使用prop 控制image显示。import React, { Component } from 'react';import { AppRegistry, Image } from 'react-native';class Bananas exte

2016-11-02 09:45:43 421

翻译 React Native 之 教程

React native 简称RN ,它很接近原生APP,但是他使用原生组件而不是web组件作为构建快。因此,为了理解 RN APP 基本结构, 你需要理解基本原生概念,例如JSX 、组件、state、和props 。如果你已经理解这些概念,你还需要学习一些 RN 的特殊部分,例如一些原生组件。本篇文章针对大众开发者,无论你是有RN 开发经验。Hello world 按照我们习惯,我们首先创建一个简

2016-11-01 20:23:36 209

翻译 React Native 之 安装

背景:Facebook 于 2015 年 9 月 15 日发布了 React Native for Android, 把 Web 和原生平台的 JavaScript 开发技术扩展到了 Google 的流行移动平台–Android。本节将帮助你安装React Native到本机系统上,然后你可以用它来构建应用程序。如果你已经安装了反应本地,你可以跳过教程。说明:安装的不同取决于你开发操作系统,例如你

2016-11-01 17:39:13 189

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除