mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-05-31 01:36:11 +00:00
Minor changes
This commit is contained in:
@@ -129,7 +129,7 @@ const examples = [
|
|||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<View style={[styles.horizontal, styles.centering]}>
|
<View style={[styles.horizontal, styles.centering]}>
|
||||||
<ActivityIndicator size="40" />
|
<ActivityIndicator size={40} />
|
||||||
<ActivityIndicator
|
<ActivityIndicator
|
||||||
style={{ marginLeft: 20, transform: [ {scale: 1.5} ] }}
|
style={{ marginLeft: 20, transform: [ {scale: 1.5} ] }}
|
||||||
size="large"
|
size="large"
|
||||||
|
|||||||
@@ -307,11 +307,11 @@ var TouchableDisabled = React.createClass({
|
|||||||
render: function() {
|
render: function() {
|
||||||
return (
|
return (
|
||||||
<View>
|
<View>
|
||||||
<TouchableOpacity disabled={true} style={[styles.row, styles.block]}>
|
<TouchableOpacity disabled={true} style={[styles.row, styles.block]} onPress={action('TouchableOpacity')}>
|
||||||
<Text style={styles.disabledButton}>Disabled TouchableOpacity</Text>
|
<Text style={styles.disabledButton}>Disabled TouchableOpacity</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
|
|
||||||
<TouchableOpacity disabled={false} style={[styles.row, styles.block]}>
|
<TouchableOpacity disabled={false} style={[styles.row, styles.block]} onPress={action('TouchableOpacity')}>
|
||||||
<Text style={styles.button}>Enabled TouchableOpacity</Text>
|
<Text style={styles.button}>Enabled TouchableOpacity</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
|
|
||||||
@@ -321,7 +321,7 @@ var TouchableDisabled = React.createClass({
|
|||||||
animationVelocity={0}
|
animationVelocity={0}
|
||||||
underlayColor="rgb(210, 230, 255)"
|
underlayColor="rgb(210, 230, 255)"
|
||||||
style={[styles.row, styles.block]}
|
style={[styles.row, styles.block]}
|
||||||
onPress={() => console.log('custom THW text - highlight')}>
|
onPress={action('TouchableHighlight')}>
|
||||||
<Text style={styles.disabledButton}>
|
<Text style={styles.disabledButton}>
|
||||||
Disabled TouchableHighlight
|
Disabled TouchableHighlight
|
||||||
</Text>
|
</Text>
|
||||||
@@ -332,7 +332,7 @@ var TouchableDisabled = React.createClass({
|
|||||||
animationVelocity={0}
|
animationVelocity={0}
|
||||||
underlayColor="rgb(210, 230, 255)"
|
underlayColor="rgb(210, 230, 255)"
|
||||||
style={[styles.row, styles.block]}
|
style={[styles.row, styles.block]}
|
||||||
onPress={() => console.log('custom THW text - highlight')}>
|
onPress={action('TouchableHighlight')}>
|
||||||
<Text style={styles.button}>
|
<Text style={styles.button}>
|
||||||
Enabled TouchableHighlight
|
Enabled TouchableHighlight
|
||||||
</Text>
|
</Text>
|
||||||
|
|||||||
@@ -15,7 +15,8 @@ describe('apis/StyleSheet/resolveTransform', () => {
|
|||||||
resolveTransform(resolvedStyle, style);
|
resolveTransform(resolvedStyle, style);
|
||||||
|
|
||||||
expect(resolvedStyle).toEqual({
|
expect(resolvedStyle).toEqual({
|
||||||
transform: 'scaleX(20) translateX(20px) rotate(20deg)' });
|
transform: 'scaleX(20) translateX(20px) rotate(20deg)'
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test('transformMatrix', () => {
|
test('transformMatrix', () => {
|
||||||
|
|||||||
@@ -6,33 +6,9 @@
|
|||||||
* @flow
|
* @flow
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { Component } from 'react';
|
|
||||||
import findNodeHandle from '../findNodeHandle';
|
import findNodeHandle from '../findNodeHandle';
|
||||||
import UIManager from '../../apis/UIManager';
|
import UIManager from '../../apis/UIManager';
|
||||||
|
|
||||||
type MeasureInWindowOnSuccessCallback = (
|
|
||||||
x: number,
|
|
||||||
y: number,
|
|
||||||
width: number,
|
|
||||||
height: number,
|
|
||||||
) => void
|
|
||||||
|
|
||||||
type MeasureLayoutOnSuccessCallback = (
|
|
||||||
left: number,
|
|
||||||
top: number,
|
|
||||||
width: number,
|
|
||||||
height: number
|
|
||||||
) => void
|
|
||||||
|
|
||||||
type MeasureOnSuccessCallback = (
|
|
||||||
x: number,
|
|
||||||
y: number,
|
|
||||||
width: number,
|
|
||||||
height: number,
|
|
||||||
pageX: number,
|
|
||||||
pageY: number
|
|
||||||
) => void
|
|
||||||
|
|
||||||
const NativeMethodsMixin = {
|
const NativeMethodsMixin = {
|
||||||
/**
|
/**
|
||||||
* Removes focus from an input or view. This is the opposite of `focus()`.
|
* Removes focus from an input or view. This is the opposite of `focus()`.
|
||||||
@@ -52,11 +28,8 @@ const NativeMethodsMixin = {
|
|||||||
/**
|
/**
|
||||||
* Determines the position and dimensions of the view
|
* Determines the position and dimensions of the view
|
||||||
*/
|
*/
|
||||||
measure(callback: MeasureOnSuccessCallback) {
|
measure(callback) {
|
||||||
UIManager.measure(
|
UIManager.measure(findNodeHandle(this), callback);
|
||||||
findNodeHandle(this),
|
|
||||||
mountSafeCallback(this, callback)
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -74,50 +47,23 @@ const NativeMethodsMixin = {
|
|||||||
* Note that these measurements are not available until after the rendering
|
* Note that these measurements are not available until after the rendering
|
||||||
* has been completed in native.
|
* has been completed in native.
|
||||||
*/
|
*/
|
||||||
measureInWindow(callback: MeasureInWindowOnSuccessCallback) {
|
measureInWindow(callback) {
|
||||||
UIManager.measureInWindow(
|
UIManager.measureInWindow(findNodeHandle(this), callback);
|
||||||
findNodeHandle(this),
|
|
||||||
mountSafeCallback(this, callback)
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Measures the view relative to another view (usually an ancestor)
|
* Measures the view relative to another view (usually an ancestor)
|
||||||
*/
|
*/
|
||||||
measureLayout(
|
measureLayout(relativeToNativeNode, onSuccess, onFail) {
|
||||||
relativeToNativeNode: Object,
|
UIManager.measureLayout(findNodeHandle(this), relativeToNativeNode, onFail, onSuccess);
|
||||||
onSuccess: MeasureLayoutOnSuccessCallback,
|
|
||||||
onFail: () => void /* currently unused */
|
|
||||||
) {
|
|
||||||
UIManager.measureLayout(
|
|
||||||
findNodeHandle(this),
|
|
||||||
relativeToNativeNode,
|
|
||||||
mountSafeCallback(this, onFail),
|
|
||||||
mountSafeCallback(this, onSuccess)
|
|
||||||
);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* This function sends props straight to the underlying DOM node.
|
* This function sends props straight to the underlying DOM node.
|
||||||
*/
|
*/
|
||||||
setNativeProps(nativeProps: Object) {
|
setNativeProps(nativeProps: Object) {
|
||||||
UIManager.updateView(
|
UIManager.updateView(findNodeHandle(this), nativeProps, this);
|
||||||
findNodeHandle(this),
|
|
||||||
nativeProps,
|
|
||||||
this
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* In the future, we should cleanup callbacks by cancelling them instead of
|
|
||||||
* using this.
|
|
||||||
*/
|
|
||||||
const mountSafeCallback = (context: Component, callback: ?Function) => (...args) => {
|
|
||||||
if (!callback) {
|
|
||||||
return undefined;
|
|
||||||
}
|
|
||||||
return callback.apply(context, args);
|
|
||||||
};
|
|
||||||
|
|
||||||
module.exports = NativeMethodsMixin;
|
module.exports = NativeMethodsMixin;
|
||||||
|
|||||||
@@ -14,15 +14,19 @@
|
|||||||
|
|
||||||
const emptyObject = {};
|
const emptyObject = {};
|
||||||
const objects = {};
|
const objects = {};
|
||||||
|
const prefix = 'r';
|
||||||
let uniqueID = 1;
|
let uniqueID = 1;
|
||||||
|
|
||||||
|
const createKey = (id) => `${prefix}${id}`;
|
||||||
|
|
||||||
class ReactNativePropRegistry {
|
class ReactNativePropRegistry {
|
||||||
static register(object: Object): number {
|
static register(object: Object): number {
|
||||||
let id = ++uniqueID;
|
let id = ++uniqueID;
|
||||||
if (process.env.NODE_ENV !== 'production') {
|
if (process.env.NODE_ENV !== 'production') {
|
||||||
Object.freeze(object);
|
Object.freeze(object);
|
||||||
}
|
}
|
||||||
objects[`${id}`] = object;
|
const key = createKey(id);
|
||||||
|
objects[key] = object;
|
||||||
return id;
|
return id;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -32,8 +36,8 @@ class ReactNativePropRegistry {
|
|||||||
// we want it to be a no-op when the value is false or null
|
// we want it to be a no-op when the value is false or null
|
||||||
return emptyObject;
|
return emptyObject;
|
||||||
}
|
}
|
||||||
|
const key = createKey(id);
|
||||||
const object = objects[`${id}`];
|
const object = objects[key];
|
||||||
if (!object) {
|
if (!object) {
|
||||||
console.warn('Invalid style with id `' + id + '`. Skipping ...');
|
console.warn('Invalid style with id `' + id + '`. Skipping ...');
|
||||||
return emptyObject;
|
return emptyObject;
|
||||||
|
|||||||
Reference in New Issue
Block a user