How do I create a diagonal border in React Native?

You can apply css to View class and create the desired output,Heres a small demo code edited version

import React, { Component } from 'react';import { View, StyleSheet } from 'react-native';import { Constants } from 'expo';export default class App extends Component {  render() {    return (      <View style={styles.container}>        <View style={styles.triangleCorner}></View>        <View style={styles.triangleCornerLayer}></View>         <View style={styles.triangleCorner1}></View>      </View>    );  }}const styles = StyleSheet.create({  container: {    flex: 1,    alignItems: 'center',    justifyContent: 'center',    paddingTop: Constants.statusBarHeight,    backgroundColor: '#ecf0f1',  },triangleCorner: {    position: 'absolute',    top:105,    left:0,    width: 300,    height: 100,    backgroundColor: 'transparent',    borderStyle: 'solid',    borderRightWidth: 50,    borderTopWidth: 80,    borderRightColor: 'transparent',    borderTopColor: 'gray'  },triangleCorner1: {    position: 'absolute',    top:100,    left:0,    width: 130,    backgroundColor: 'transparent',    borderStyle: 'solid',    borderRightWidth: 50,    borderTopWidth: 90,    borderRightColor: 'transparent',    borderTopColor: 'green'  },triangleCornerLayer: {    position: 'absolute',    top:107,    left:0,    width:297,    height: 100,    backgroundColor: 'transparent',    borderStyle: 'solid',    borderRightWidth: 47,    borderTopWidth: 75,    borderRightColor: 'transparent',    borderTopColor: 'white'  }});

Result:

Use CALayer for that kind of shape.

Below code for that:

    let layer = CAShapeLayer()    let path = UIBezierPath()    path.move(to: CGPoint(x: 0, y: 0))    path.addLine(to: CGPoint(x: 150, y: 0))    path.addLine(to: CGPoint(x: 100, y: 50))    path.addLine(to: CGPoint(x: 0, y: 50))    path.close()    layer.path = path.cgPath    layer.fillColor = UIColor.green.cgColor    layer.strokeColor = UIColor.clear.cgColor    view.layer.addSublayer(layer)    let layer1 = CAShapeLayer()    path.move(to: CGPoint(x: 100, y: 45))    path.addLine(to: CGPoint(x: 300, y: 45))    path.addLine(to: CGPoint(x: 350, y: 5))    path.addLine(to: CGPoint(x: 150, y: 5))    path.close()    layer1.path = path.cgPath    layer1.fillColor = UIColor.clear.cgColor    layer1.strokeColor = UIColor.black.cgColor    view.layer.addSublayer(layer1)