博客专栏  >  移动开发   >  react native 学习之旅

react native 学习之旅

好记性不如烂笔头

关注
3 已关注
44篇博文
  • react native 获取验证码

    获取验证码控件:https://github.com/781238222/react-native-verify-code

    2017-08-02 15:34
    492
  • react-native 分割线

    react-native 分割线:https://github.com/781238222/react-native-divide

    2017-08-02 15:35
    497
  • react-native http封装

    react-native http封装:https://github.com/781238222/react-native-http

    2017-08-02 15:35
    279
  • react-native modal封装

    github地址:https://github.com/781238222/react-native-xmodal

    2017-08-02 15:37
    316
  • react native 顶部控件

    github地址:https://github.com/781238222/react-native-header-bar

    2017-08-02 15:38
    234
  • 学习博客园开源代码笔记(一)

    学习别人写的项目是一个不错的学习方法,地址:https://github.com/togayther/react-native-cnblogs 看别人代码的时候可能会遇到各种问题,这里做下记录也希望大...

    2017-06-30 16:49
    104
  • 学习博客园开源代码笔记(startup页面)

    startup页面效果图:页面的基本逻辑:logo动画->是否登录 已经登录跳转到home页面,未登录弹出登录modal。看下render方法:render() { return ( ...

    2017-07-03 15:46
    83
  • 学习博客园开源代码笔记(登录页面)

    效果图: render() { return ( { this.renderHeader() } { this

    2017-07-05 15:48
    112
  • react native 封装Touchable 组件

    上一篇我们讲解了4个Touchable 组件的基本用法,既然系统提供了那我们为什么要自己封装呢,自己封装有下面几个好处: 一旦需求变化我们不用全局修改,只需要修改我们封装组件。 全局统一。 目前r...

    2017-04-19 17:07
    225
  • react native 闪屏页(启动页)封装

    基本上大部分app都会有一个闪屏页(启动页),下面我们就封装一下,要求: 一张图片透明度在1500ms时间内由0.4变化为1。 提供图片source和动画执行完毕的回调。 /** * Created...

    2017-06-05 17:41
    326
  • react native Back 按钮封装

    项目中返回按钮出现的频率非常高,所以我们封装一个Back按钮,基本要求如下: 传入图片资源作为按钮图片 可以设置点击区域style和图片style 点击回调函数 传入react-...

    2017-06-06 10:52
    259
  • react native 密码控件 封装

    密码控件 主要包含以下功能: 1、点击右侧的icon显示明文/密文 2、相应的icon变化。封装代码:/** * Created by on 2017/3/31. */ import Reac...

    2017-06-30 14:44
    380
  • react native Toast封装

    app经常用到消息的提示功能,封装效果图: 样式我封装的只有2个样式,错误提示就像图中一样,红底,普通提示是黑底,如果需要求他样式请自行修改。封装代码:import React, {Compon...

    2017-07-07 09:58
    239
  • react native ActivityIndicator使用详解

    react-native版本:0.43 ActivityIndicator的效果类似我们平时看到了loading,在android中ActivityIndicator是progressBar 的Ind...

    2017-04-07 14:29
    234
  • react native Button 使用详解

    Button其实就是 Touchable(TouchableNativeFeedback、TouchableOpacity)和Text封装而来,下面是Button的部分源码:render() { co...

    2017-04-10 10:17
    1234
  • react native Text 使用详解

    Text 是显示文本的控件,常用属性如下: numberOfLines : 最大行数,当超过时截取文本。 onLongPress:长按回调函数 onPress:点击回调函数 Style...

    2017-04-12 13:53
    338
  • react native Switch使用详解

    Switch:开关控件 主要属性: value:是否打开。默认为false disabled:是否禁用 默认false onTintColor:打开时背景色 thumbTint...

    2017-04-18 10:11
    1120
  • react native ScrollView 使用详解

    ScrollView 是一个滚动控件,当内容显示不全时可以通过滚动显示。属性: View props… :View的所有属性 contentContainerStyle:内容容器的样式,所有...

    2017-04-18 15:08
    2713
  • react native FlatList 使用详解

    高性能的简单列表组件,支持下面这些常用的功能: 完全跨平台。 支持水平布局模式。 行组件显示或隐藏时可配置回调事件。 支持单独的头部组件。 支持单独的尾部组件。 支持自定义行间分隔线。 支持下拉刷新。...

    2017-04-18 16:38
    8904
  • react native SectionList 使用详解

    SectionList 和FlatList的基本一样,和FlatList一样的地方就不介绍啦。那什么时候使用FlatList,什么时候使用SectionList呢?如果你的列表不需要分组,那么可以使用...

    2017-04-19 09:29
    3900
img博客搬家
img撰写博客
img专家申请
img意见反馈
img返回顶部