Skip to content

Commit aadc9bf

Browse files
mgcreamgcrea
committed
refactor: wrap SwiftUI components in VStack for better layout structure
1 parent a6517ba commit aadc9bf

File tree

6 files changed

+189
-181
lines changed

6 files changed

+189
-181
lines changed

‎example/ios/RNSwiftUIExample.xcodeproj/project.pbxproj‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -199,14 +199,10 @@
199199
inputFileListPaths = (
200200
"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-frameworks-${CONFIGURATION}-input-files.xcfilelist",
201201
);
202-
inputPaths = (
203-
);
204202
name = "[CP] Embed Pods Frameworks";
205203
outputFileListPaths = (
206204
"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-frameworks-${CONFIGURATION}-output-files.xcfilelist",
207205
);
208-
outputPaths = (
209-
);
210206
runOnlyForDeploymentPostprocessing = 0;
211207
shellPath = /bin/sh;
212208
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-frameworks.sh\"\n";
@@ -242,14 +238,10 @@
242238
inputFileListPaths = (
243239
"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-resources-${CONFIGURATION}-input-files.xcfilelist",
244240
);
245-
inputPaths = (
246-
);
247241
name = "[CP] Copy Pods Resources";
248242
outputFileListPaths = (
249243
"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-resources-${CONFIGURATION}-output-files.xcfilelist",
250244
);
251-
outputPaths = (
252-
);
253245
runOnlyForDeploymentPostprocessing = 0;
254246
shellPath = /bin/sh;
255247
shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-RNSwiftUIExample/Pods-RNSwiftUIExample-resources.sh\"\n";
@@ -394,7 +386,10 @@
394386
"-DFOLLY_CFG_NO_COROUTINES=1",
395387
"-DFOLLY_HAVE_CLOCK_GETTIME=1",
396388
);
397-
OTHER_LDFLAGS = "$(inherited) ";
389+
OTHER_LDFLAGS = (
390+
"$(inherited)",
391+
" ",
392+
);
398393
REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
399394
SDKROOT = iphoneos;
400395
SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG";
@@ -463,7 +458,10 @@
463458
"-DFOLLY_CFG_NO_COROUTINES=1",
464459
"-DFOLLY_HAVE_CLOCK_GETTIME=1",
465460
);
466-
OTHER_LDFLAGS = "$(inherited) ";
461+
OTHER_LDFLAGS = (
462+
"$(inherited)",
463+
" ",
464+
);
467465
REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
468466
SDKROOT = iphoneos;
469467
USE_HERMES = true;

‎example/src/views/BasicFormExample.tsx‎

Lines changed: 32 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -21,36 +21,38 @@ export const BasicFormExample: FunctionComponent = () => {
2121
return (
2222
<View style={{flex: 1}}>
2323
<SwiftUI style={{flex: 1}}>
24-
<SwiftUI.Text text="BasicFormExample" />
25-
<SwiftUI.Form>
26-
<SwiftUI.Section header="Personal Information">
27-
<SwiftUI.TextField
28-
placeholder="First name"
29-
onChange={setFirstName}
30-
text={firstName}
31-
/>
32-
<SwiftUI.TextField
33-
placeholder="Last name"
34-
onChange={setLastName}
35-
text={lastName}
36-
/>
37-
</SwiftUI.Section>
38-
<SwiftUI.Section header="Additional Details">
39-
<SwiftUI.Picker
40-
options={['Male', 'Female']}
41-
label="Gender"
42-
onChange={setGender}
43-
selection={gender}
44-
/>
45-
<SwiftUI.DatePicker
46-
label="Birth date"
47-
selection={birthDate}
48-
onChange={value => setBirthDate(value)}
49-
displayedComponents="date"
50-
/>
51-
</SwiftUI.Section>
52-
<SwiftUI.Button title="Submit" onPress={handleSubmit} />
53-
</SwiftUI.Form>
24+
<SwiftUI.VStack>
25+
<SwiftUI.Text text="BasicFormExample" />
26+
<SwiftUI.Form>
27+
<SwiftUI.Section header="Personal Information">
28+
<SwiftUI.TextField
29+
placeholder="First name"
30+
onChange={setFirstName}
31+
text={firstName}
32+
/>
33+
<SwiftUI.TextField
34+
placeholder="Last name"
35+
onChange={setLastName}
36+
text={lastName}
37+
/>
38+
</SwiftUI.Section>
39+
<SwiftUI.Section header="Additional Details">
40+
<SwiftUI.Picker
41+
options={['Male', 'Female']}
42+
label="Gender"
43+
onChange={setGender}
44+
selection={gender}
45+
/>
46+
<SwiftUI.DatePicker
47+
label="Birth date"
48+
selection={birthDate}
49+
onChange={value => setBirthDate(value)}
50+
displayedComponents="date"
51+
/>
52+
</SwiftUI.Section>
53+
<SwiftUI.Button title="Submit" onPress={handleSubmit} />
54+
</SwiftUI.Form>
55+
</SwiftUI.VStack>
5456
</SwiftUI>
5557
</View>
5658
);

‎example/src/views/FullFormExample.tsx‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,21 @@ export const FullFormExample: FunctionComponent = () => {
77
return (
88
<View style={{flex: 1}}>
99
<SwiftUI style={{flex: 1}}>
10-
<SwiftUI.Text text="FullFormExample" />
11-
<SwiftUI.Form>
12-
<LazyVGridSection />
13-
<TextFieldSection />
14-
<PickerMenuSection />
15-
<PickerSegmentedSection />
16-
<DatePickerSection />
17-
<StepperSection />
18-
<SliderSection />
19-
<ToggleSection />
20-
<ImageSection />
21-
<RectangleSection />
22-
</SwiftUI.Form>
10+
<SwiftUI.VStack>
11+
<SwiftUI.Text text="FullFormExample" />
12+
<SwiftUI.Form>
13+
<LazyVGridSection />
14+
<TextFieldSection />
15+
<PickerMenuSection />
16+
<PickerSegmentedSection />
17+
<DatePickerSection />
18+
<StepperSection />
19+
<SliderSection />
20+
<ToggleSection />
21+
<ImageSection />
22+
<RectangleSection />
23+
</SwiftUI.Form>
24+
</SwiftUI.VStack>
2325
</SwiftUI>
2426
</View>
2527
);

‎example/src/views/LayoutExample.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,14 @@ export const LayoutExample: FunctionComponent = () => {
77
return (
88
<View style={{flex: 1}}>
99
<SwiftUI style={{flex: 1}}>
10-
<SwiftUI.Text text="LayoutExample" />
11-
<SwiftUI.Form>
12-
<LazyVGridSection />
13-
<ImageSection />
14-
<RectangleSection />
15-
</SwiftUI.Form>
10+
<SwiftUI.VStack>
11+
<SwiftUI.Text text="LayoutExample" />
12+
<SwiftUI.Form>
13+
<LazyVGridSection />
14+
<ImageSection />
15+
<RectangleSection />
16+
</SwiftUI.Form>
17+
</SwiftUI.VStack>
1618
</SwiftUI>
1719
</View>
1820
);

‎example/src/views/ReactHookFormExample.tsx‎

Lines changed: 58 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -34,63 +34,65 @@ export const ReactHookFormExample: FunctionComponent = () => {
3434
return (
3535
<View style={{flex: 1}}>
3636
<SwiftUI style={{flex: 1}}>
37-
<SwiftUI.Text text="ReactHookFormExample" />
38-
<SwiftUI.Form>
39-
<SwiftUI.Section header="Personal Information">
40-
<Controller
41-
name="firstName"
42-
control={control}
43-
rules={{
44-
required: true,
45-
}}
46-
render={({field: {onChange, onBlur, value}}) => (
47-
<SwiftUI.TextField
48-
placeholder="First name"
49-
onBlur={onBlur}
50-
onChange={onChange}
51-
text={value}
52-
disabled
53-
/>
54-
)}
37+
<SwiftUI.VStack>
38+
<SwiftUI.Text text="ReactHookFormExample" />
39+
<SwiftUI.Form>
40+
<SwiftUI.Section header="Personal Information">
41+
<Controller
42+
name="firstName"
43+
control={control}
44+
rules={{
45+
required: true,
46+
}}
47+
render={({field: {onChange, onBlur, value}}) => (
48+
<SwiftUI.TextField
49+
placeholder="First name"
50+
onBlur={onBlur}
51+
onChange={onChange}
52+
text={value}
53+
disabled
54+
/>
55+
)}
56+
/>
57+
<Controller
58+
name="lastName"
59+
control={control}
60+
rules={{
61+
required: true,
62+
}}
63+
render={({field: {onChange, onBlur, value}}) => (
64+
<SwiftUI.TextField
65+
placeholder="Last name"
66+
onBlur={onBlur}
67+
onChange={onChange}
68+
text={value}
69+
/>
70+
)}
71+
/>
72+
<Controller
73+
name="birthDate"
74+
control={control}
75+
rules={{
76+
required: true,
77+
}}
78+
render={({field: {onChange, value}}) => (
79+
<SwiftUI.DatePicker
80+
label="Birth Date:"
81+
selection={value}
82+
displayedComponents="date" // Show only date, no time
83+
onChange={onChange}
84+
// disabled
85+
datePickerStyle="automatic"
86+
/>
87+
)}
88+
/>
89+
</SwiftUI.Section>
90+
<SwiftUI.Button
91+
title="Submit"
92+
onPress={handleSubmit(onValidSubmit, onInvalidSubmit)}
5593
/>
56-
<Controller
57-
name="lastName"
58-
control={control}
59-
rules={{
60-
required: true,
61-
}}
62-
render={({field: {onChange, onBlur, value}}) => (
63-
<SwiftUI.TextField
64-
placeholder="Last name"
65-
onBlur={onBlur}
66-
onChange={onChange}
67-
text={value}
68-
/>
69-
)}
70-
/>
71-
<Controller
72-
name="birthDate"
73-
control={control}
74-
rules={{
75-
required: true,
76-
}}
77-
render={({field: {onChange, value}}) => (
78-
<SwiftUI.DatePicker
79-
label="Birth Date:"
80-
selection={value}
81-
displayedComponents="date" // Show only date, no time
82-
onChange={onChange}
83-
// disabled
84-
datePickerStyle="automatic"
85-
/>
86-
)}
87-
/>
88-
</SwiftUI.Section>
89-
<SwiftUI.Button
90-
title="Submit"
91-
onPress={handleSubmit(onValidSubmit, onInvalidSubmit)}
92-
/>
93-
</SwiftUI.Form>
94+
</SwiftUI.Form>
95+
</SwiftUI.VStack>
9496
</SwiftUI>
9597
</View>
9698
);

0 commit comments

Comments
 (0)