Skip to content

Commit 6256b62

Browse files
author
rulishu
committed
Merge branch 'dev' of github.com:uiwjs/react-native-uiw into rls
2 parents a5c59ea + 6db60c2 commit 6256b62

File tree

6 files changed

+254
-249
lines changed

6 files changed

+254
-249
lines changed

‎example/examples/src/routes/Empty/index.tsx‎

Lines changed: 29 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -31,35 +31,33 @@ const xml = `
3131

3232
export interface DividerViewProps extends ComProps {}
3333

34-
export default class DividerView extends React.Component<DividerViewProps> {
35-
render() {
36-
const {route} = this.props;
37-
const description = route.params.description;
38-
const title = route.params.title;
39-
return (
40-
<Container>
41-
<Layout>
42-
<Header title={title} description={description} />
43-
<Body>
44-
<Card title="默认基础实例">
45-
<Empty />
46-
</Card>
47-
<Card title="自定义文字 label?: string">
48-
<Empty label="冇得数据咯" />
49-
</Card>
50-
<Card title="替换默认图标 xml?: string;">
51-
<Empty label="冇得数据咯" xml={xml} />
52-
</Card>
53-
<Card title="自定义图标尺寸 size?: number">
54-
<Empty label="冇得数据咯" size={120} />
55-
</Card>
56-
<Card title="自定义文字样式 labelStyle?: TextProps['style']">
57-
<Empty label="冇得数据咯" labelStyle={{color: 'red'}} />
58-
</Card>
59-
</Body>
60-
<Footer />
61-
</Layout>
62-
</Container>
63-
);
64-
}
34+
export default function DividerView(props: DividerViewProps) {
35+
const {route} = props || {};
36+
const description = route.params.description;
37+
const title = route.params.title;
38+
return (
39+
<Container>
40+
<Layout>
41+
<Header title={title} description={description} />
42+
<Body>
43+
<Card title="默认基础实例">
44+
<Empty />
45+
</Card>
46+
<Card title="自定义文字 label?: string">
47+
<Empty label="冇得数据咯" />
48+
</Card>
49+
<Card title="替换默认图标 xml?: string;">
50+
<Empty label="冇得数据咯" xml={xml} />
51+
</Card>
52+
<Card title="自定义图标尺寸 size?: number">
53+
<Empty label="冇得数据咯" size={120} />
54+
</Card>
55+
<Card title="自定义文字样式 labelStyle?: TextProps['style']">
56+
<Empty label="冇得数据咯" labelStyle={{color: 'red'}} />
57+
</Card>
58+
</Body>
59+
<Footer />
60+
</Layout>
61+
</Container>
62+
);
6563
}

‎packages/core/src/Avatar/index.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,8 @@ export interface AvatarProps extends ViewProps {
3737
}
3838

3939
export default function Avatar(props: AvatarProps) {
40-
const { style, src = defaultImage, size = 40, shape = 'square', rounded = 3, imageProps, ...otherProps } = props;
40+
const { style, src, size, shape, rounded, imageProps, ...otherProps } = props;
41+
4142
return (
4243
<View
4344
style={[
@@ -56,3 +57,10 @@ export default function Avatar(props: AvatarProps) {
5657
</View>
5758
);
5859
}
60+
61+
Avatar.defaultProps = {
62+
src: defaultImage,
63+
shape: 'square',
64+
rounded: 3,
65+
size: 40,
66+
} as AvatarProps;

‎packages/core/src/Button/README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ class Demo extends Component {
2323
<Spacing/>
2424
<Button disabled>disabled</Button>
2525
<Spacing/>
26-
<Button type="primary">primary</Button>
26+
<Button type="primary" onPress={()=>console.log("The Button")}>primary</Button>
2727
<Spacing/>
2828
<Button type="warning">warning</Button>
2929
<Spacing/>
@@ -181,7 +181,7 @@ export default Demo
181181

182182
```
183183

184-
### 自定义图标
184+
### 自定义图标
185185

186186
```jsx mdx:preview
187187

‎packages/core/src/Button/index.tsx‎

Lines changed: 110 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -35,121 +35,120 @@ export interface ButtonProps extends TouchableOpacityProps {
3535
bordered?: boolean;
3636
}
3737

38-
export default class ButtonView<T> extends React.Component<ButtonProps> {
39-
static defaultProps: ButtonProps = {
40-
activeOpacity: 0.5,
41-
rounded: 5,
42-
bordered: true,
43-
size: 'default',
44-
};
45-
render() {
46-
const {
47-
children,
48-
style,
49-
textStyle: childStyle,
50-
rounded,
51-
bordered,
52-
color: buttonColor,
53-
type,
54-
size,
55-
disabled,
56-
loading,
57-
...restProps
58-
} = this.props;
59-
let backgroundColor, textColor, borderColor, borderWidth, borderRadius;
38+
export default function ButtonView<T>(props: ButtonProps) {
39+
const {
40+
children,
41+
style,
42+
textStyle: childStyle,
43+
rounded,
44+
bordered,
45+
color: buttonColor,
46+
type,
47+
size,
48+
disabled,
49+
loading,
50+
...restProps
51+
} = props;
52+
let backgroundColor, textColor, borderColor, borderWidth, borderRadius;
6053

61-
switch (type) {
62-
case 'warning':
63-
backgroundColor = colors.yellow;
64-
break;
65-
case 'primary':
66-
backgroundColor = colors.blue;
67-
break;
68-
case 'success':
69-
backgroundColor = colors.green;
70-
break;
71-
case 'danger':
72-
backgroundColor = colors.red;
73-
break;
74-
case 'light':
75-
backgroundColor = colors.white;
76-
break;
77-
case 'dark':
78-
backgroundColor = colors.black;
79-
break;
80-
default:
81-
break;
82-
}
83-
if (backgroundColor) {
84-
backgroundColor = color(backgroundColor).rgb().string();
85-
}
86-
if (type) {
87-
textColor = color(backgroundColor).isLight()
88-
? color(colors.black).rgb().string()
89-
: color(colors.white).rgb().string();
90-
}
91-
if (!type) {
92-
borderColor = color(colors.black).alpha(0.32).rgb().string();
93-
borderWidth = 1;
94-
}
95-
if (disabled) {
96-
textColor = color(textColor).alpha(0.3).rgb().string();
97-
}
98-
if (buttonColor) {
99-
backgroundColor = color(buttonColor).rgb().string();
100-
textColor = color(buttonColor).isLight()
101-
? color(buttonColor).darken(0.9).string()
102-
: color(buttonColor).lighten(0.9).string();
103-
}
104-
if (rounded && (typeof rounded === 'number' || typeof rounded === 'boolean')) {
105-
borderRadius = rounded;
106-
}
107-
if (backgroundColor) {
108-
borderColor = color(backgroundColor).darken(0.2).string();
109-
borderWidth = 1;
110-
}
111-
if (!bordered) {
112-
borderWidth = 0;
113-
}
114-
const buttonStyle = {
115-
backgroundColor,
116-
borderColor,
117-
borderWidth,
118-
borderRadius,
119-
};
120-
const textStyle = { color: textColor };
121-
let sizeStyle = {};
122-
if (size && styles[size]) {
123-
sizeStyle = styles[size];
124-
}
125-
let boxStyle = {};
126-
const styleKey = `${size}Box` as keyof typeof styles;
127-
if (size && styles[styleKey]) {
128-
boxStyle = styles[styleKey];
129-
}
130-
if (!children) {
131-
return null;
132-
}
133-
return (
134-
<TouchableOpacity
135-
testID="RNE__Button__wrap"
136-
style={[styles.button, styles.content, buttonStyle, boxStyle, style]}
137-
disabled={disabled}
138-
{...restProps}
139-
>
140-
{loading && <ActivityIndicator size={16} color={textColor} style={styles.icon} />}
141-
{React.Children.toArray(children).map((child: any, idx) => {
142-
return (
143-
<Div testID="RNE__Button__div" key={idx} style={[sizeStyle, styles.label, textStyle, childStyle]}>
144-
{child}
145-
</Div>
146-
);
147-
})}
148-
</TouchableOpacity>
149-
);
54+
switch (type) {
55+
case 'warning':
56+
backgroundColor = colors.yellow;
57+
break;
58+
case 'primary':
59+
backgroundColor = colors.blue;
60+
break;
61+
case 'success':
62+
backgroundColor = colors.green;
63+
break;
64+
case 'danger':
65+
backgroundColor = colors.red;
66+
break;
67+
case 'light':
68+
backgroundColor = colors.white;
69+
break;
70+
case 'dark':
71+
backgroundColor = colors.black;
72+
break;
73+
default:
74+
break;
75+
}
76+
if (backgroundColor) {
77+
backgroundColor = color(backgroundColor).rgb().string();
78+
}
79+
if (type) {
80+
textColor = color(backgroundColor).isLight()
81+
? color(colors.black).rgb().string()
82+
: color(colors.white).rgb().string();
83+
}
84+
if (!type) {
85+
borderColor = color(colors.black).alpha(0.32).rgb().string();
86+
borderWidth = 1;
87+
}
88+
if (disabled) {
89+
textColor = color(textColor).alpha(0.3).rgb().string();
90+
}
91+
if (buttonColor) {
92+
backgroundColor = color(buttonColor).rgb().string();
93+
textColor = color(buttonColor).isLight()
94+
? color(buttonColor).darken(0.9).string()
95+
: color(buttonColor).lighten(0.9).string();
96+
}
97+
if (rounded && (typeof rounded === 'number' || typeof rounded === 'boolean')) {
98+
borderRadius = rounded;
15099
}
100+
if (backgroundColor) {
101+
borderColor = color(backgroundColor).darken(0.2).string();
102+
borderWidth = 1;
103+
}
104+
if (!bordered) {
105+
borderWidth = 0;
106+
}
107+
const buttonStyle = {
108+
backgroundColor,
109+
borderColor,
110+
borderWidth,
111+
borderRadius,
112+
};
113+
const textStyle = { color: textColor };
114+
let sizeStyle = {};
115+
if (size && styles[size]) {
116+
sizeStyle = styles[size];
117+
}
118+
let boxStyle = {};
119+
const styleKey = `${size}Box` as keyof typeof styles;
120+
if (size && styles[styleKey]) {
121+
boxStyle = styles[styleKey];
122+
}
123+
if (!children) {
124+
return null;
125+
}
126+
return (
127+
<TouchableOpacity
128+
testID="RNE__Button__wrap"
129+
style={[styles.button, styles.content, buttonStyle, boxStyle, style]}
130+
disabled={disabled}
131+
{...restProps}
132+
>
133+
{loading && <ActivityIndicator size={16} color={textColor} style={styles.icon} />}
134+
{React.Children.toArray(children).map((child: any, idx) => {
135+
return (
136+
<Div testID="RNE__Button__div" key={idx} style={[sizeStyle, styles.label, textStyle, childStyle]}>
137+
{child}
138+
</Div>
139+
);
140+
})}
141+
</TouchableOpacity>
142+
);
151143
}
152144

145+
ButtonView.defaultProps = {
146+
activeOpacity: 0.5,
147+
rounded: 5,
148+
bordered: true,
149+
size: 'default',
150+
} as ButtonProps;
151+
153152
const styles = StyleSheet.create({
154153
button: {
155154
borderStyle: 'solid',

0 commit comments

Comments
 (0)