You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: pages/deploy/1-prepare-app.md
+14-9Lines changed: 14 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,35 +1,40 @@
1
1
# Preparing your App for deployment
2
2
3
-
Once you have built your UI with Ensemble and used it to build your app and are ready to take it to production, follow these instructions to deploy it to any iOS or Android devices, or to submit it to the Apple AppStore or Google Play Store.
3
+
Once you have built your UI with Ensemble and used it to build your app and are ready to take it to production, follow these instructions to deploy it to any iOS or Android devices, or to submit it to the Apple App Store or Google Play Store.
4
4
5
5
### Prerequisites
6
-
* Your Ensemble App ID. From [Ensemble Studio](https://studio.ensembleui.com), go to your App's Settings screen to retrieve the App ID.
6
+
7
+
- Your Ensemble App ID. From [Ensemble Studio](https://studio.ensembleui.com), go to your App's Settings screen to retrieve the App ID.
7
8
8
9
### Download Ensemble Starter
9
-
Ensemble Starter is our packaging solution, enabling you to connect to your Ensemble UI and package it.
10
-
* Clone the Starter App `git clone https://github.com/EnsembleUI/starter my_first_app` into the folder *my_first_app*. You may change the name, but don't use camelCase (e.g. myFirstApp) or dash (-) as the separators.
11
-
* Follow the README in this repo.
10
+
11
+
Ensemble Starter is our packaging solution, enabling you to connect to your Ensemble UI and package it.
12
+
13
+
- Clone the Starter App `git clone https://github.com/EnsembleUI/starter my_first_app` into the folder _my_first_app_. You may change the name, but don't use camelCase (e.g. myFirstApp) or dash (-) as the separators.
14
+
- Follow the README in this repo.
12
15
13
16
### Requesting permissions from your end-users
17
+
14
18
If your app requires capabilities like location, camera, ..., you will need to enter a reason per capability. These reasons will be prompted to the end users, who can decide whether to grant or deny your requests.
15
-
* For iOS, edit `<my_first_app>/ios/Runner/Info.plist` and add the below permissions as the direct children of the `<dict>` tag.
16
-
* For Android, edit `<my_first_app>/android/app/src/main/AndroidManifest.xml` and add the below permissions as the direct children of the `<manifest>` tag.
19
+
20
+
- For iOS, edit `<my_first_app>/ios/Runner/Info.plist` and add the below permissions as the direct children of the `<dict>` tag.
21
+
- For Android, edit `<my_first_app>/android/app/src/main/AndroidManifest.xml` and add the below permissions as the direct children of the `<manifest>` tag.
17
22
18
23
Below are the snippet per capability to insert for iOS and Android respectively.
19
24
20
25
**Location**
26
+
21
27
```xml
22
28
<key>NSLocationWhenInUseUsageDescription</key>
23
29
<string>e.g. This app needs access to your location to ....</string>
24
30
```
25
31
26
32
**Camera**
33
+
27
34
```xml
28
35
<key>NSCameraUsageDescription</key>
29
36
<string>e.g. your reason for requesting camera access</string>
30
37
31
38
<key>NSMicrophoneUsageDescription</key>
32
39
<string>e.g. your reason for requesting microphone access</string>
Copy file name to clipboardExpand all lines: pages/index.mdx
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,22 +4,22 @@
4
4
5
5
Ensemble is a platform where you can build, publish, and iterate native and web apps without leaving your browser.
6
6
7
-
With Ensemble, you create apps by defining them using a declarative language. Think of it as configuring your app, instead of coding it. Ensemble apps are rendered at runtime by interpreting this declerative definition. This architecture means that:
7
+
With Ensemble, you create apps by defining them using a declarative language. Think of it as configuring your app, instead of coding it. Ensemble apps are rendered at runtime by interpreting this declarative definition. This architecture means that:
8
8
9
9
1. Ensemble apps are native to each platform: iOS, Android, and web.
10
10
2. Ensemble apps can be updated instantly because the app definitions are pushed to clients. You can use Ensemble's cloud service, or use your own server.
11
-
3. Ensemble apps always leverage the latest front-end technologies (Flutter for iOS and Android, React for web) so that you don't have to worry about tech-debt incured by using these technologies.
11
+
3. Ensemble apps always leverage the latest front-end technologies (Flutter for iOS and Android, React for web) so that you don't have to worry about tech-debt incurred by using these technologies.
12
12
13
13
14
14
15
15
## How do I build my app?
16
16
17
-
Ensemble provides a browser-based IDE, [Ensemble Studio](https://studio.ensembleui.com), where you can build, test, and publish your apps all from the browser. You can instantly preview your Ensemble apps on iOS and Anrdoid devices using [Ensemble preview app](/test/preview-app). Once ready to publish, Ensemble automatically push your apps to Apple AppStore and Google PlayStore. For web, you can download a web build and host it on any service.
17
+
Ensemble provides a browser-based IDE, [Ensemble Studio](https://studio.ensembleui.com), where you can build, test, and publish your apps all from the browser. You can instantly preview your Ensemble apps on iOS and Android devices using [Ensemble preview app](/test/preview-app). Once ready to publish, Ensemble automatically pushes your apps to Apple App Store and Google Play Store. For web, you can download a web build and host it on any service.
18
18
19
19
## Need help?
20
20
21
21
[Chat with us on Discord](https://discord.gg/cEHkJTmn75)
| maxWidth | integer | The max width of this Input widget (default 700). while min vlaue can be `0` and maximum can be `5000`|
13
-
| label | string | Label for your widget |
14
-
| labelHint | string | Hint text on your label |
15
-
| hintText | string | Hint text explaining your widget |
16
-
| required | boolean | Whether the field is required |
17
-
| enabled | boolean | Enables or disables the interactivity and input functionality of the widget |
18
-
| icon | object |[See properties](#icon)|
19
-
| onChange | action | Call Ensemble's built-in functions or execute code when the input changes. Note for free-form text input, this event only dispatches if the text changes AND the focus is lost (e.g. clicking on button) |
20
-
| onChangeHaptic | enum | The type of haptic to perform when switch state is changed. It should be one of heavyImpact, mediumImpact, lightImpact, selectionClick, and vibrate |
21
-
| value | string | Specifying the value of your Text Input |
| maxWidth | integer | The max width of this Input widget (default 700). while min value can be `0` and maximum can be `5000`|
13
+
| label | string | Label for your widget |
14
+
| labelHint | string | Hint text on your label |
15
+
| hintText | string | Hint text explaining your widget |
16
+
| required | boolean | Whether the field is required |
17
+
| enabled | boolean | Enables or disables the interactivity and input functionality of the widget |
18
+
| icon | object |[See properties](#icon)|
19
+
| onChange | action | Call Ensemble's built-in functions or execute code when the switch value changes |
20
+
| onChangeHaptic | enum | The type of haptic to perform when switch state is changed. It should be one of heavyImpact, mediumImpact, lightImpact, selectionClick, and vibrate |
21
+
| value | boolean | The current state of the switch. `true` for on, `false` for off |
| items | array | List of values, or Objects with value/label pairs |
24
+
| styles | object |[see properties](#styles)|
25
+
| leadingText | string | Sets the text displayed before the switch |
26
+
| trailingText | string | Sets the text displayed after the switch |
27
+
| activeColor | color | The color of the switch track when it is in the active/on state, starting with '0xFF' for full opacity. |
28
+
| inactiveColor | color | The color of the switch track when it is in the inactive/off state, starting with '0xFF' for full opacity.|
29
+
| activeThumbColor | color | The color of the switch thumb when it is in the active/on state, starting with '0xFF' for full opacity. |
30
+
| inactiveThumbColor | color | The color of the switch thumb when it is in the inactive/off state, starting with '0xFF' for full opacity.|
31
+
| useIOSStyle | boolean | If true, renders the switch using iOS-style appearance (CupertinoSwitch). When false, uses Material style (default) |
27
32
28
33
### styles
29
34
@@ -32,7 +37,7 @@ The Switch Widget enables the rendering of switch toggle elements, providing use
32
37
| variant | string | Select a pre-defined look and feel for this Input widget. This property can be defined in the theme to apply to all Input widgets. [see properties](#options-for-stylesvariant)|
33
38
| visible | boolean | Toggle a widget visibility on/off. Note that an invisible widget will not occupy UI space, unless the visibilityTransitionDuration is specified. |
34
39
| visibilityTransitionDuration | number | Specify the duration in seconds when a widget animates between visible and not visible state. Note that setting this value will cause the widget to still occupy the UI space even when it is not visible. |
35
-
| opacity | double | Adjusts the opacity of the widget. Values range from 0 (fully transparent) to 1 (opaque). Default is `1`. |
40
+
| opacity | double | Adjusts the opacity of the widget. Values range from 0 (fully transparent) to 1 (opaque). Default is `1`.|
36
41
| stackPositionTop | integer | The distance of the child's top edge from the top of the stack. This is applicable only for Stack's children. |
37
42
| stackPositionBottom | integer | The distance that the child's bottom edge from the bottom of the stack. This is applicable only for Stack's children. |
38
43
| stackPositionLeft | integer | The distance that the child's left edge from the left of the stack. This is applicable only for Stack's children. |
@@ -52,7 +57,6 @@ The Switch Widget enables the rendering of switch toggle elements, providing use
52
57
| borderRadius | string or integer | The border radius of the widget.This can be specified using CSS-like notation with 1 to 4 integers. Minimum value: 0. |
53
58
| borderColor | integer or string | Sets the border color, starting with '0xFF' for full opacity. `transparent``black``blue``white``red``grey``teal``amber``pink``purple``yellow``green``brown``cyan``indigo``lime``orange`|
54
59
| borderWidth | integer | Thickness of the border. Minimum value should be 0. |
55
-
| expanded | boolean | If the parent is a Row or Column, this flag will stretch this widget in the appropriate direction. (e.g stretch horizontally for parent of type Row) |
0 commit comments