Formatting the appearance of your sheet is quick and easy in Ragic Design Mode. Having a consistent format for your sheets makes your database look more organized. You can also design multiple versions of the same sheet to match the look and feel you envision when printing or exporting your data as files.
Changing the height and width of your fields
In Form Page
Changing the height and width of cells works the same way as in spreadsheet software applications such as Excel. Dragging the right border of a column's reference tab helps you to adjust the width of the column.
Likewise, dragging the bottom border of a row's reference tab will adjust the height of the row.
In Listing Page
Dragging the right border of a column's reference tab helps you to adjust the width of the column.
You can also drag the bottom border of a row's reference tab to adjust the height of all the rows in the table.
Directly set column width or row height
By right-clicking the column or row you want to edit and selecting the column width or row height option, you can directly enter pixel values in the pop-up window to adjust the column width or row height. You can also drag multiple fields and edit column width or row height.
Changing the style of field headers and values
You can change the style of field headers or values from the Styles tab in Design Mode. This can be done separately for form and listing pages.
If you want to apply custom styling to field values while entering data, you can use BBCodes for text formatting while doing so.
Adding field borders
You can also add Field Borders to field headers and values from the Styles tab in Design Mode. This can also be be done separately for form and listing pages.
Click on the square Border Icon under the Label Style formatting toolbar or the Value Style formatting toolbar.
A formatting menu will display options for choosing field borders.
You can also select the border color and style.
Your border will be placed in your form design.
To copy and paste selected formatting to another field, you can click the Copy Styles. This will apply the same style configurations to the next clicked field.
To copy a selected style to multiple fields, check the Paste copied styles to multiple fields.
Clear style of this field
You can clear style of a single field by clicking Clear style of this field under Styles tab.
Clear style of all fields
You can clear all of the styles and Theme in this sheet by clicking Clear style of all fields.
Applying a theme
You can also apply preselected themes to a form page. To preview available themes, click the Select Theme Icon under the Styles tab.
Select and apply the theme of your choice.
From Design Mode, you can move existing fields by dragging and dropping. Click and hold the field header with your primary mouse button, drag it to an empty space on your form, and drop it by releasing the mouse button.
You can also move your subtable to another row from Design Mode by dragging. First, make sure that you have at least three fields beneath your subtable field headers (these will expand later when editing your form). Drag one of your subtable fields to an empty cell to start the process. You will see a prompt asking if you want to move your subtable. Select the leftmost field where you would like your first subtable field to begin. Upon confirmation, Ragic will shift your entire subtable to match.
If you want to shift the order of subtable fields, you can drag and drop them horizontally.
Formatting Static Text Fields
You can also change fields into Static Text Fields from the Editing Descriptions option under the Editing Fields menu in Design Mode. The usages of static text fields range from headers and other decorative elements to descriptive text fields and user instructions.
When the field is selected, a formatting toolbar will appear on the left. You can change the font size and style, text alignment, text and cell colors, and link to a URL.
Selecting the color options for a Static Text Field will display a Color Picker, which allows you to adjust the canvas, choose a color swatch, or enter a hexadecimal code in the upper-left-hand corner.
Span (merge) fields
You can span fields in multiple columns by selecting the Span Multi Column option in the left sidebar under the Basic tab, which will then merge the number of fields you input in the same row.
To do this in static text fields, just drag the lower-right corner of the field.
Change Tab color
To change the color of a tab, right-click to access the context menu and then select Change Color.
This will display a Color Picker, which allows you to adjust the canvas, choose a color swatch, or enter a hexadecimal code in the upper-left-hand corner. Once you have selected your preferred tab color, click Save Color.
Change Tab Icon
To change the Tab Icon, right-click to access the context menu and click Change Icon.
A pop-up menu will be displayed. Simply select or upload the icon you would like to apply to your tab.