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:

Basic Components: contains all basic components, such as String Field and CheckBox without any additional labels and styling.
Image Removed

Image Removed

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 Palette and /wiki/spaces/HELP91/pages/9050655401.

You can also configure PhixFlow to use automatically your prefered palette; see application properties → Basic Settings → Default Component PaletteCreating your own palette or adding your own templates to existing palette can help you save time and effort. PhixFlow is installed with two palettes that can be used to create your own palette items. Additional palettes can be installed, via Template Packages, for more detail on how to do this see About Template Packages.

Creating a Palette

To create a palette:

1. Right-click In the repository branch → navigate to your Application → Palette and select 

   Insert excerpt
   _new _new nopanel true

   .
2. PhixFlow opens a properties tab for the palette. Name the palette and save it.
3. In the Screens section, click the your application navigate to the

   1. Insert excerpt
      _layer_list _layer_list nopanel true

    button Template section, click the  button to see all the templates in the repository.
4. Drag components into the Component list.
5. Optionally set up Default Components.
6. Optionally define Palette Groups.
7. Save your palette.

To remove items from a palette, right-click on the item in the palette and click 

You can also configure PhixFlow to use automatically your prefered palette; see application properties → Basic Settings → Default Component Palette.

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 to a Palette

If you have a component that you want to add to a palette, you must first copy it as a template; see Creating Layout Templates.

To add a template to a palette:

1. Open the repository tab and palette tab.
2. Drag one of the tabs into the workspace to show the tabs side-by-side.
3. From the repository branch → Template, drag a template from the repository into a palette.

To remove items from a palette, right-click on the item in the palette and click 

You can group components into sub-sections of a palette; see Palette Groups, below.

Palette Properties

Basic Settings

Components

This section has a toolbar with standard buttons and 

The grid contains a list of components that this palette contains. To add a component to the list:

1. Click

   Insert excerpt
   _layer_list _layer_list nopanel true

    to list all the components in the repository.
2. Drag components into this list to add them to the palette. 

To remove a template from the palette, use the

Default Components

You can select a  template to use by default for common form fields.

Palette Groups 

Anchor
group group

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:

1. Click

   Insert excerpt
   _new _new nopanel true

   .
2. PhixFlow opens the Palette Group properties.
3. Set the name and order. Add the components you require.

4. Insert excerpt
   _finish _finish nopanel true

   .

To remove a group from the palette, use the

Pallet Group Properties

Description

Can I Add New Components to a Theme?

Yes. Whenever you want to reuse an item severlhave to set up a component, such as a new area or button, decide if you might need the same thing again. If so, create a template of the component, so it is ready to use. Otherwise you have to repeatedly combine the building-block components and set the properties to recreate the component. Once you have a template, you can add it to Theme 2. 

For example, you create a Field Column that is auto sized to use all the available space. To add this to Theme 2.

1. Find the component in the repository. Right-click and select Copy as a template
2. PhixFlow adds the component to the applications repository folder called Templates.
3. Optionally, drag the component from Templates folder in the repository, to the  Theme 2 package. 
4. To make it available to other application designers, drag it to a palette. This can be either one of the existing Theme 2 palettes or a custom palette you have already created.

Can I Change Theme 2?

It may be necessary to update Theme 2 so that it reflects the design you want for your application. For example, you might want to add your own company and application logos, or change the background colour to one that matches your corporate colours.

Before making any changes, consider the impact this will have on the template. For example, if you want to change an area component to have a blue (#2E2F4D) background, consider if you want all areas added from the palette to be blue.

• If you do, update the area Shared Style so that all areas inherit the new CSS property. This is a global change to the palette.
• If not, you could change the background colour by adding a new CSS Property or a Style Setting to the component. This is a local or object level change.  
  Even if you think you only want to change one object, consider creating a Shared Style that you add to the object. This means it is easy to apply to any other components that you decide need to be blue. 

If you want to change the background colour everywhere in the palette, not just on areas, consider creating a new template and palette.