小编ano*_*ous的帖子

我正在 formik 上制作一个表单，并希望它采用全屏宽度。我尝试过 flex: 1，改变弯曲方向，并改变填充。当文本比输入字段宽时，它会扩展以适应输入字段。我不想设置宽度，因为我希望它随着手机屏幕的宽度而变化。这是现在的样子的图片https://i.stack.imgur.com/wuwC9.png

这是我的样式代码：

const styles = StyleSheet.create({
  input: {
    padding: 10,
    fontSize: 18,
    borderRadius: 6,
    flex: 1,
    borderBottomColor: '#000',
    borderBottomWidth: 2,
    alignSelf: 'stretch',
    flexDirection: 'row',
  },
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  inner: {
    //padding: 20,
    flex: 1,
    // justifyContent: 'flex-end',
  },
});

输入字段如下所示：

 <View style={styles.container}>
      <Formik
        initialValues={{
          first_name: '',
          last_name: '',
          address_1: '',
          address_2: '',
          city: '',
          state: '',
          postcode: '',
          country: 'CA',
          email: 'john.doe@example.com',
          phone: '647-274-8068',
        }}
        // Form …

我正在尝试在材料社区图标中使用店面图标。但是我收到一个错误，它不显示图标。这是我的代码：

import { StatusBar } from "expo-status-bar";
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { createMaterialBottomTabNavigator } from "@react-navigation/material-bottom-tabs";
import { NavigationContainer } from "@react-navigation/native";
import Icon from "react-native-vector-icons/MaterialCommunityIcons";

import Products from "./src/components/Products";
import Cart from "./src/components/Cart";
import Account from "./src/components/Account";

const Tab = createMaterialBottomTabNavigator();

export default class App extends React.Component {
  render() {
    return (
      <NavigationContainer>
        <Tab.Navigator
          initialRouteName="Browse"
          activeColor="#f0edf6"
          inactiveColor="#A3A3A3"
          barStyle={{ backgroundColor: "#515151" }}
        >
          <Tab.Screen
            name="Browse"
            component={Products}
            options={{
              tabBarLabel: "Browse",
              tabBarIcon: ({ …