Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Insert excerpt
_Banners
_Banners
namescreen
nopaneltrue

Overview

Creating 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

In the repository navigate to your Application → Palette and select 

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:

  • using the style, only new buttons are pink
  • using the shared style, in any application all the components that use that colour setting will turn pink.

To change a palette component without affecting any existing uses of it, create a style that overrides the existing style.

  1.  In the palette, right-click on a component and select  
    Insert excerpt
    _newedit
    _newedit
    nopaneltrue
    .
  2. PhixFlow opens a properties tab for the palette. Name the palette and save it.
  3. Click If you need to find a child component, such as a header on a complete screen, right-click on the parent and select 
    Insert excerpt
    _repository_find
    _repository_find
    nopaneltrue
    This lists all the child components. Double-click the specific component to open its properties.
  4. In the component properties, click on the 
    Insert excerpt
    _property_templatetabs
    _templateproperty_tabs
    namestyle
    nopaneltrue
     icon to display the available templates that can be used in your palette.
    1. If you have not created any templates yet see Creating Layout Templates.
  5. The templates can be dragged into into the Component list of your palette.
  6. Optionally, define logical Palette Groups and drag templates into the components section.
  7. Optionally, The palette and template components can be moved to a package where you will be able to define the Default Components.In the repository expand Packages and select .
  8. Edit the style properties to have the required settings; see Style properties.
  9. Insert excerpt
    _save
    _save
    nopaneltrue
     your changes.


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:

  1.  In the palette, right-click on a component and select  
    Insert excerpt
    _
    new
    edit
    _
    new
    edit
    nopaneltrue
  2. Create your package and complete the details,
    1. If you want to define default components, tick Template
    2. In the Template Details section, define the defaults you want your palette to use.
    3. Note you only need to define these if you are creating a Palette that you will use as your default palette.
  3. When you create a new application and select your package it will automatically create all the associations to use your content. If you add your palette after you have created your application and want to set it as the default palette or just override some of the settings, you will need to:
    1. Open the properties for your application by double clicking on it
    2. Click the Styles tab.
    3. Scroll down to Default Components.
    4. Set the values as appropriate
    5. Save your changes and any defaults you have set will now be used. 
Adding to a Palette
  1. .
  2. In the component properties, click on the 
    Insert excerpt
    _property_tabs
    _property_tabs
    namestyle
    nopaneltrue
    .
  3. In the Shared Styles section, click
    Insert excerpt
    _add
    _add
    nopaneltrue
    .
  4. Edit the shared style properties to have the required settings; see Style properties.
  5. Insert excerpt
    _save
    _save
    nopaneltrue
     your changes.

The following video shows how to do this.

Iframe
srchttps://www.youtube.com/embed/X8A_8l4rSMM?rel=0
width560px
height315px

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 template component; see Creating Layout TemplatesMaking Template Components.

To add a template component to a palette:

  1. Open the repository.
  2. Navigate to the palette and right-click select edit.
  3. Drag the Palette tab into the workspace to show the tabs side-by-side.
  4. 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

Palettes Items

Components

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

Insert excerpt
_delete
_delete
nopaneltrue
. This removes the component from the palette, but does not remove it the component from the repository.

Can I Change the Styles of a Palette?

See Editing a Palette

Setting 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.

Default Component are set at the application or system level:

  1. Application Level 
    1. Open the properties for your application by double clicking on it
    2. Click the Styles tab.
    3. Scroll down to Default Components.
    4. Set the require defaults.
  2. System Level
    1. Open Administration Menu → System  → Configuration
    2. Scroll down to Default Components.
    3. Set the require defaults. Note that Application Level defaults will override system one.
ExpandPalette Properties

Creating a New Palette

  1. In the repository navigate to your Application → Palette section and select 
    Insert excerpt
    _
parent
  1. new
    _
parent
  1. new
    nopaneltrue

Basic Settings

FieldDescriptionName
Name of the palette

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 
  1. .
Help URL
  1. PhixFlow opens a properties tab for the palette. Name the palette and save it.
  2. Click the 
    Insert excerpt
    _
help
  1. template
    _
help
  1. template
    nopaneltrue
     icon
which links
  1. to
the URL specified here. AnchorAddingToAPaletteAddingToAPalettePalette Groups  Anchorgroupgroup

Use palette groups to organise your templates.

Adding a Palette Group

  1. Click display the available templates. If you have not created any templates yet see Making Template Components.
  2. Drag the templates into the palette properties →  Component section.
  3. 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.

To remove a group from the palette, use the
  1. In the repository expand Packages and select 
    Insert excerpt
    _new
    _new
    nopaneltrue
    .
  2. PhixFlow opens the Palette Group properties.
  3. Set the name and order. Add the components you require.
  4. Insert excerpt_finish_finishnopaneltrue.

Removing a Palette Group

  1. Create your package and complete the details.
  2. 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
_

delete

property_tabs

_delete

_property_tabs
namestyle
nopaneltrue

 in the toolbar

.

Pallet Group Properties

FieldDescriptionNameName of the palette group.OrderEnter a number to specify where this group appears in the palette.Components

This section has a toolbar with  standard buttons

Click 

To change the default palette or components for your application:

  1. In the repository, expand Applications.
  2. Double-click on the application name. 
  3. Click the
    Insert excerpt
    _
template
  1. property_
list
  1. tabs
    _
template_list
  1. property_tabs
    namestyle
    nopaneltrue
 to open the full repository list of Templates. If you want to see only templates from your application, find your application → Templates.

Drag in the templates you want to appear in this group.

Description

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

FieldDescriptionTooltipThe description that will appear at the tooltip for this palette.DescriptionWe recommend you always add a description of this palette. Insert excerpt_audit_auditnopaneltrue
  1. .
  2. Scroll down to Default Components.
  3. Select the palette or components you want to use.
  4. Save your changes

Next time you drag a table or attribute onto a screen canvas, PhixFlow uses the default components you have set.