Overview
A palette provides quick access to set of configured templates, which you can dragging onto forms to create components.
PhixFlow comes with two default palettes:
You can also install additional Theme palettes. These are designed to have everything you need to create GUI screens by simply dragging the tiles from the palette into a screen. See also About Template Packages, Using a Template Package and /wiki/spaces/HELP12/pages/9615720309.
You can also configure PhixFlow to use automatically your prefered palette; see application properties → Basic Settings → Default Component Palette.
Creating a Palette
To create a palette:
Right-click the repository branch → Application → PaletteInsert excerpt | ||||||||
---|---|---|---|---|---|---|---|---|
|
Overview
You can make changes to the palettes, by adding components or removing them. You can also change the appearance of components in a palette, for example to use corporate colours.
You may prefer to leave the palettes supplied by PhixFlow unchanged and instead create your own palette.
Changing Styles
Warning |
---|
Changing the style of a component on the palette affects any future use of the component for all applications that have access to the palette. Existing uses of the component are not affected. Changing shared styles affect all existing uses of the component as well as future uses; see Screen Styling. For example, if you change a button to have a pink background:
|
To change a palette component without affecting any existing uses of it, create a style that overrides the existing style.
- In the palette, right-click on a component and select
.Insert excerpt _edit _edit nopanel true
If you need to find a child component, such as a header on a complete screen, right-click on the parent and select
.PhixFlow opens a properties tab for the palette. Name the palette and save itThis lists all the child components. Double-click the specific component to open its properties.Insert excerpt _newrepository_find _newrepository_find nopanel true - In the Screens sectioncomponent properties, click on the
layerInsert excerpt _
listproperty_
layer_listtabs _
button to see all the templates in the repository.property_tabs name style nopanel true - Drag components into the Component list.
- Optionally set up Default Components.
- Optionally define Palette Groups.
- Save your palette.
.- Edit the style properties to have the required settings; see Style properties.
your changes.Insert excerpt _save _save nopanel true
To change an aspect of the style of all components in a palette, for example to add a company logo or change the colour scheme to that of your company:
- In the palette, right-click on
- a component and select
Insert excerpt _
edit _
.edit nopanel true
- In the component
Default Components
For any screen that you design, there are common elements, such as forms, true/false fields, or fields for specific types of data, such as long strings or floating point numbers. After you have added these to the Components section of the palette properties, use the Default Component section to select which of the components you want to use for the base components. PhixFlow displays these in a "Base Component" palette.
Adding a Template to a Palette- properties, click on the
.Insert excerpt _property_tabs _property_tabs name style nopanel true - In the Shared Styles section, click
.Insert excerpt _add _add nopanel true - Edit the shared style properties to have the required settings; see Style properties.
your changes.Insert excerpt _save _save nopanel true
The following video shows how to do this.
Iframe | ||||||
---|---|---|---|---|---|---|
|
Adding Components
If you have a component that you want to add to a palette, you must first save a copy it as a template component; see Creating Layout TemplatesMaking Template Components.
To add a template component to a palette:
- Open the repository tab and palette tab.
- Navigate to the palette and right-click select edit.
- Drag one of the tabs Palette tab into the workspace to show the tabs side-by-side.
- From the repository branch → Template, drag a template from the repository into a palette or open one of the groups and add it there.
Removing Components
To remove items components from a palette, right-click on the item in the palette and click
Insert excerpt | ||||||
---|---|---|---|---|---|---|
|
You can group components into sub-sections of a palette; see Palette Groups, below.
Palette PropertiesCreating a New Palette
- In the repository navigate to your Application → Palette section and select
Insert excerpt _
new _
new nopanel true
Basic Settings
- .
For palettes supplied by PhixFlow, this URL links to the help page about the palette.
If you create your own palette, add a link to additional information to help people to use your palette.
PhixFlow displays the palette header bar with a- PhixFlow opens a properties tab for the palette. Name the palette and save it.
- Click the
Insert excerpt _
template _
icontemplate nopanel true
- to display the
Components
This section has a toolbar with standard buttons andThe grid contains a list of components that this palette contains. To add a component to the list:
ClickDefault Components
You can select a template to use by default for common form fields.
Add a template:
This section has a toolbar with standard buttons. The grid contains a list of the groups this palette contains.
Use palette groups to organise your templates, making it easier to find what you need. For example, Theme 2 has 3 palettes. The Theme 2 - App Builder palette has different components grouped together.
We recommend you have a guiding principle for creating groups. For example, Theme 2 is organised with the most complete components, such as entire forms, first. Individual data fields are last. The groups in between have container components that you add to a screen first, then the tiles or tile elements that need to be dropped into a container.
To add a group to the list:
- Click
- PhixFlow opens the Palette Group properties.
- Set the name and order. Add the components you require.
Insert excerpt _finish _finishavailable templates. If you have not created any templates yet see Making Template Components.- Drag the templates into the palette properties → Component section.
- Optionally, define Palette Groups and drag templates into the groups.
This creates a palette to which you can add components. This is only available to your application.
Sharing a Palette
If you want to share your palette with other applications, move the palette and template components from your application into a package that the other applications use. You can then set some components to be defaults.
- In the repository expand Packages and select
.Insert excerpt _new _new nopanel true - Create your package and complete the details.
Optionally, to make this a template package, tick Template; see Understanding Template Packages. Then specify the components you want to use as default components in the Template Details section.
Setting Default Components
When you create a new application you select a template package. PhixFlow uses the information in the template package to configure the default components. When creating a screen, if you drag in a table or attribute, PhixFlow uses the default component for forms, true/false fields, or fields for specific types of data, such as long strings or floating point numbers.
You can see which default components have been set in Application Properties →
Insert excerpt | ||||||||
---|---|---|---|---|---|---|---|---|
|
To
remove a group fromchange the
palette, use thePallet Group Properties
This section has a toolbar with standard buttons.
Clickdefault palette or components for your application:
- In the repository, expand Applications.
- Double-click on the application name.
- Click the
Insert excerpt _
property_
tabs _
property_tabs name style nopanel true
Drag in the templates you want to appear in this group.
Tooltip Enter a tooltip. This will be displayed when a user hovers their mouse pointer over the palette group.
Description Enter a description for this palette group.
Description
- .
- Scroll down to Default Components.
- Select the palette or components you want to use.
- Save your changes
Next time you drag a table or attribute onto a screen canvas, PhixFlow uses the default components you have set.