Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Insert excerpt
_Banners
_Banners
namescreen
nopaneltrue

This page is for application designers who plan to use tiles and components from one of the themes provided by PhixFlow.

What is a Template Package?

In PhixFlow you can share the same resources with multiple applications by adding them to a package, and adding the package to the different applications. A package can contain anything an application can contain, such as:

  • individual modelling Modelling objects or complete analysis models
  • screen Screen components and whole screens
  • shared Shared styles and palettes

A template package additionally has Template Package has properties to set the default components and styles that your an application uses. When you create an application, PhixFlow provides a list of the template packages, so you can select the one you want to use for your application and the application will copy its default properties, such as number formats and default components for form fields.

Here is an illustration of what makes up a template package:

  • A template package is a package with extra options to specify a palette and other default properties related to styles.
  • The palette contains individual components and components are combined into layouts. These have been designed to give your screens a consistent look-and-feel. When you are working on a screen, PhixFlow displays the palette(s) from your template package. You can drag components from the palette onto the a screen. 
  • The properties specify which styles, formats and components to use by default when you are designing screens for your application. For example, when you drag an attribute onto a screen, PhixFlow adds the default field component to your screen.
  • One or more applications can use the layouts and components from the palette and have the same style properties, all of which are provided by the template package.

Using a Temple Package

PhixFlow is installed with two default palettes, Basic Components and Labelled Fields. These provide simple components for your screens. However, to To get the most from PhixFlow we recommend you download and install the different themed designs we have created; see the Available Templates Packages, below.

  • Theme 1 - Cobalt Lake 
  • Theme 2 - Urban Complex 
  • Theme 2.1 - Urban Serenity 

    one of our preconfigured Template Packages. These contain palettes of items which will help you create your application. Currently one is available for PhixFlow Version 9, with more coming soon.

    Install

    For how to download and install these package templates, see Installing Template Packages.

    Setup

    1. When you create an application, PhixFlow provides a list of the available template packages.
    Simply select
    1. Select the one that you want to use to set the default palette and styles for the application.
      TipYou can adapt the designs of palettes and change the default styles set in a template package to suit your won requirements. For example, you can change the colours to reflect your company colours, and include your logos
    1. When you create a screen the palette will be displayed automatically.
      1. It can also be displayed by clicking 
        Insert excerpt
        _palette
        _palette
        .
    2. Simply drag items from the palette onto your screen to begin creating, see Adding Screen Content for more information.

    Using Different Palettes

    An application can only use a palette that has been added to the application, this can be achieved by:

    • either by selecting the template Selecting a template package that contains a package when you create the application,.
    • or by adding Adding the palette's package to the application; see Package.
    When you are designing a screen, you can use components from any of the palettes available in the palettes list. However, we recommend you use components from the same palette if you want a consistent design.
    • Creating a palette directly in the application.

    Updating Application Defaults

    After creating an application, you can change the default styles and palette in Application Properties → Basic Settings → Default Component Palette.

    If you drag a table, view or attribute onto a screen canvas, PhixFlow adds the appropriate component from the first default palette finds in:

    1. the  Application Properties
    2. the Package properties
    3. the System Configuration.

    Learn more

  • How to download and install a package or template package; see Installing Template Packages.
  • How to create a template package; see  Package
  • Changing default styles for an application; see Application Properties

    .

  • How to use a palette; see Using a Palette   
  • How to add a component to the palette; see Adding Components to a Palette
  • How to create your own palette; see Creating a Palette and Palette
  • Available Template Packages 
    Anchor
    themes
    themes

    Image Removed Theme 1 - Cobalt Lake anchor

    theme1theme1

    Image Removed  Download

    Image Removed  Fully Configurable

    Theme 1 offers a striking two-tone look, with bright overtones that can be configured to suit your own design needs. Offering straight forward implementation Theme 1 has the flexibility to fit your application requirements, from data charts to form over data input screens.

    For an illustration of Theme 1 in action, see the /wiki/spaces/HELP100/pages/9106736940 video.

    Image Removed

    Image Removed

    Image Removed Theme 2 - Urban Complex  Anchortheme2theme2

    Image Removed  Download

    Image Removed Fully Configurable

    Theme 2 has a subtle, contemporary look and feel, with minimalist grey tones and a splash of colour. Offering straightforward implementation Theme 2 has the flexibility to fit your application requirements, from data grids to integrated maps.  As with all themes, it can be configured to suit your own design.

    Image Removed Responsive Design

    The Theme provides a responsive design right out of the box, meaning that your applications display well on any device on which they are being viewed. This is achieved using a versatile tile based approach. The tiles house all of the app content and can be resized proportionally to one another to suit their content. For example, a larger tile can be configured for a data entry form and a smaller one for a map.

    Image RemovedExample Dashboards

    Building on the success of Theme 1, Theme 2 provides more functionality, more flexibility and is even more straight forward to use. We’ve also included a set of example dashboards as a guide to what's included in the Theme. These can be found in the Theme 2 package in the repository.

    Tip

    For more details about Theme 2 and what it includes, see Using a Palette.

    To learn how to design an application using Theme 2, see the /wiki/spaces/HELP100/pages/9106726483.

    Image Removed

    Image Removed

    Image Modified Theme 2.1 -

    Urban Serenity 

    Serene Grey
    Anchor
    theme21
    theme21

      Download

     Rocket Fuelled!

    Theme 2.1 is a rocket fuelled version of Theme 2. It includes a host of new and exciting templates including the new Kanban board, enhanced card containers and even more preconfigured complete screens than before. As before it is fully customisable to suit your own design needs.  

     Faster Screen Building

    Theme 2.1 now has a simplified structure which means everything you need in one place! A single palette that is divided into logical groups such as complete screens, tiles and buttons, and now when you drag an item onto a screen dynamic highlighting shows where it should be placed.

     Responsive Design

    The responsiveness of the theme has been tuned to improve the appearance of application screens on mobile devices. This means you still get responsiveness built into the layout templates right out of the box using a versatile tile based approach, but screens will scale down to mobile devices accurately. We have also made setting the scaling sizes much easier by separating out the minimum size settings into their own style.

    Example Dashboards

    We’ve included more example dashboards than ever before! These dashboards illustrate all of the layout templates provided in Theme 2.1, These can be found in the Theme 2 package in the repository and in the new Theme 2.1 application that comes with this Template Package.

    Learn more