How to use the react-native.StyleSheet.create function in react-native

To help you get started, we’ve selected a few react-native examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github kriskate / pocket-dota / src / components / Drawer.js View on Github external
{ Object.keys(SCREEN_LABELS).map(label =>
          label.substr(0, 6) == 'HEADER'
            ? 
            : 
        ) }
      
    );
  }
}

const wrapperHeight = 150;
const logoRatio = 1600/ 450;
const logoHeight = wrapperHeight/2 - Layout.padding_small;
const styles = StyleSheet.create({
  imgIconWrapper: {
    paddingTop: getStatusBarHeight(),
    padding: Layout.padding_regular,
    alignItems: 'center',
    justifyContent: 'center',
    height: wrapperHeight + getStatusBarHeight(),
    backgroundColor: Colors.dota_ui1+'99',
  },
  imgIcon: {
    // borderColor: Colors.disabled,
    borderRadius: 10,
    // borderWidth: 1,
    width: logoHeight * logoRatio,
    height: logoHeight,
  },
  imgBackground: {
github Nozbe / zacs / examples / native / App.js View on Github external
View,
  Text,
  StatusBar,
} from 'react-native';

import {
  Header,
  LearnMoreLinks,
  Colors,
  DebugInstructions,
  ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';

import zacs from '@nozbe/zacs';

const styles = StyleSheet.create({
  scrollView: {
    backgroundColor: Colors.lighter,
  },
  engine: {
    position: 'absolute',
    right: 0,
  },
  body: {
    backgroundColor: Colors.white,
  },
  sectionContainer: {
    marginTop: 32,
    paddingHorizontal: 24,
  },
  sectionTitle: {
    fontSize: 24,
github sidewalklabs / commonspace / expo_project / screens / DrawerNavigatorScreen.js View on Github external
style={styles.signOutButton}
                    onPress={this._signOut}
                    theme={{ ...Theme, roundness: 20 }}>
                    
                  
                
              
            
          )}
        
      
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  button: {
    marginTop: 8,
    marginLeft: 8,
    marginRight: 8,
    borderRadius: 4,
  },
  buttonRow: {
    height: 40,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'flex-start',
  },
  activeButton: {
github Skjutsgruppen / skjutsgruppen-reactnative / app / components / common / retry.js View on Github external
import React from 'react';
import { StyleSheet, View, TouchableOpacity, ViewPropTypes } from 'react-native';
import PropTypes from 'prop-types';
import { trans } from '@lang/i18n';
import { Colors } from '@theme';
import { AppText } from '@components/utils/texts';

const styles = StyleSheet.create({
  wrapper: {
    marginVertical: 20,
  },
  errorText: {
    lineHeight: 32,
  },
});

const Retry = ({ onPress, style }) => (
  
);
github iZaL / my-appointment / src / components / PromoImage.js View on Github external
return (
      <img style="{styles.container}">
        
        
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor:'white',
    width:Dimensions.get('window').width,
    height:Dimensions.get('window').height
  },
  promoView: {
    flex:1,
    backgroundColor: 'transparent',
    justifyContent:'center',
  },
  text: {
    color: 'white',
    textAlign: 'center'
  },
  promoHeader: {
github coreyphillips / moonshine / src / components / WalletSliderEntry.tsx View on Github external
);
};

_WalletSliderEntry.propTypes = {
	walletId: PropTypes.string.isRequired,
	wallet: PropTypes.object.isRequired,
	cryptoUnit: PropTypes.string.isRequired,
	updateWallet: PropTypes.func.isRequired,
	deleteWallet: PropTypes.func.isRequired,
	displayTestnet: PropTypes.bool.isRequired,
	onCoinPress: PropTypes.func.isRequired,
	updateActiveSlide: PropTypes.func.isRequired
};

const styles = StyleSheet.create({
	container: {
		flex: 1,
		alignItems: "center",
		justifyContent: "center",
		backgroundColor: "transparent"
	},
	header: {
		marginBottom: 20
	},
	headerText: {
		...systemWeights.thin,
		fontSize: 40,
		color: colors.white,
		textAlign: "center"
	},
	innerContainer: {
github florianstahr / react-native-settings-components / src / switch / switch.jsx View on Github external
import React, { Component } from 'react';
import {
  StyleSheet, Switch, Text, View,
} from 'react-native';
import PropTypes from 'prop-types';

const style = StyleSheet.create({
  defaultContainerStyle: {
    padding: 0,
    minHeight: 50,
    backgroundColor: 'white',
    alignItems: 'center',
    flexDirection: 'row',
  },
  defaultTitleStyle: {
    flex: 0,
    paddingLeft: 16,
    paddingRight: 8,
    fontSize: 16,
  },
  defaultDescriptionStyle: {
    flex: 0,
    paddingLeft: 16,
github FiberJW / pul / components / Carpooler.js View on Github external
/&gt;
        
          {this.props.selfIsDriver &amp;&amp;
            this.props.user.type === "rider" &amp;&amp;
            this.renderDriverPassengerContent()}
          {this.props.user.type === "rider" &amp;&amp;
            !this.props.selfIsDriver &amp;&amp;
            this.renderPeerPassengerContent()}
          {this.props.user.type === "driver" &amp;&amp; this.renderDriverContent()}
        
      
    );
  }
}

const styles = StyleSheet.create({
  cardContainer: {
    flex: 1,
    paddingVertical: 8,
    paddingHorizontal: 16,
    marginHorizontal: 8,
    marginVertical: 4,
    backgroundColor: "white"
  },
  collapsedContentContainer: {
    marginTop: 16,
    marginBottom: 8
  },
  contactDriverButton: {
    justifyContent: "center",
    alignItems: "center",
    borderRadius: 4,
github akshetpandey / react-native-cronet / example / App.js View on Github external
);
    }
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    height: 500,
    justifyContent: 'space-evenly',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,