Hello Anand S,
yes, the approach is called variants. As starting point I would recommend you the chapter Managing variants. Then following steps describe more or less the approach of having one project with two different resolutions:
Step 1: You develop first the UI for one resolution. Preferably for the larger resolution.
Step 2: Now you add a new Profile member to your project. Or you duplicate the existing profile. Configure the new profile with the desired (different, e.g. smaller) screen size.
Step 3: Prepare all assets (image files, e.g. PNG) in the accordingly scaled down size.
Step 4: In the next step you derive variants of all bitmap and all font resources used in your project. See Bitmap resource variant and Font resource variant. Configure the variant condition of each derived variant to depend on the new profile (from step 2).
The variants are thus active ONLY when the profile is selected for prototyping or code generation.
Step 5: In case of bitmap resource variants adapt the members to refer the smaller assets from step 3. In case of font resources just adjust the Height attribute according to the size reduction.
Step 6: Now select the new profile (from step 2) to be the active one.
Step 7: As next you go through your project and derive a variant of each GUI component you have created in the step 1.
Step 8: Similarly to bitmap and font variants configure the variants derived from GUI components to be active when the new profile is used. See step 4.
step 9: Edit the variants now one by one. In particular, adjust the size of the GUI component and the position and the size of embedded views to correspond to the new screen resolution. In case of the embedded views, you can select all views and scale (resize) them at once by resizing the surrounding area. See also Resize members.
step 10: If you have hard coded position or size values you have to adapt your implementation to use different values depending on the actually selected profile. You do this by Chora preprocessor $if..$endif and testing which profile is actually selected. Or more sophisticated by using multi variant constants also configured to depend on the profile.
Now, when you generate code for the old profile, all variants are ignored. Accordingly, the resulting code uses the original resolution. When you switch to the new profile, the variants are active. The bitmaps and fonts are replaced by new variants. Components are replaced by the derived variants too containing other position and size information for the embedded views.
I hope it helps you further.
Best regards
Paul Banach
