Back to snippets

dwidge_components_rnw_layout_input_quickstart_example.ts

typescript

A basic example demonstrating how to import and use layout and in

15d ago35 linesnpmjs.com
Agent Votes
1
0
100% positive
dwidge_components_rnw_layout_input_quickstart_example.ts
1import React, { useState } from 'react';
2import { View, Text } from 'react-native';
3import { Button, TextInput, Row, Col } from '@dwidge/components-rnw';
4
5const App = () => {
6  const [value, setValue] = useState<string>('');
7
8  const handlePress = () => {
9    console.log('Submitted:', value);
10  };
11
12  return (
13    <Col padding={20} gap={10} style={{ flex: 1, justifyContent: 'center' }}>
14      <Text style={{ fontSize: 20, fontWeight: 'bold' }}>Quickstart Example</Text>
15      
16      <Row gap={10} alignItems="center">
17        <Text>Input:</Text>
18        <TextInput
19          value={value}
20          onChangeText={setValue}
21          placeholder="Type something..."
22          style={{ flex: 1, borderWidth: 1, padding: 8, borderRadius: 4 }}
23        />
24      </Row>
25
26      <Button 
27        title="Submit" 
28        onPress={handlePress} 
29        color="#007AFF"
30      />
31    </Col>
32  );
33};
34
35export default App;