Question

因此，除了TextInput之外，我使用的所有组件都是由我创建的。在另一个Navigator路由中，我使用除TextInput之外的所有组件，并且它们按预期工作。但在这种情况下，我的Buttom定位如何跟随Card位置而不是外部视图

// GoalForm.js

import React from 'react';
import { View, Text, Platform } from 'react-native';

const generateShadow = () => {
    switch(Platform.OS) {
        case 'android':
            return { elevation: 5 };
        case 'ios':
            return 0;
    }
}

const Header = (props) => {
    const { textStyle, viewStyle } = styles;

    return (
        <View style={ [ viewStyle, { backgroundColor: props.color }, generateShadow() ] }>
            <Text style={textStyle}>{ props.text }</Text>
        </View>
    );
};

Header.propTypes = {
    color: React.PropTypes.string.isRequired,
    text: React.PropTypes.string.isRequired,
};

const styles = {
    textStyle: {
        color: 'white',
        fontWeight: 'bold',
        fontSize: 20
    },
    viewStyle: {
        paddingLeft: 20,
        height: 55,
        flexDirection: 'column',
        justifyContent: 'space-around'
    }
};

export default Header;

// Card.js

def resize_img(original_image, size):
    sizes = {
        'thumbnail': (128, 128),
        'medium': (640, 640),
        'large': (1024, 1024)
    }

    im = Image.open(BytesIO(original_image.read()))
    img = im.copy()

    img.thumbnail(sizes[size], Image.ANTIALIAS)
    byte_io = BytesIO()
    img.save(byte_io, 'JPEG')
    byte_io.seek(0)
    return byte_io

// Button.js

boto3

// Header.js

mvexpand

有人能发现我在这里失踪的东西吗？提前致谢

Answer 1

我需要将我的卡组件包装在带有flex的视图中：1

按钮定位根据错误的视图

1 个答案: