Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Version History

« Previous Version 84 Next »

Overview

Screens* allows you and your users to interact with the data in your application, actions such as creating, reading, updating and deleting records can all be performed.

PhixFlow provides a complete suite of tools that utilise drag and drop for building beautiful screens quickly and easily, from simple data entry screens to fully interactive screens which display content dynamically based on the users activity. To help supercharge the screen building process templates are available, in a number of different styles, giving you instant access to a host of prebuilt screens and components, all of which are fully customisable.

Screens Page Layout

You are here. Here is a simplified view of the screen page.

  1. The toolbar provides screen specific options, such as listing your available tables which can then be dragged onto the canvas to build a view and displaying the screen properties to you can edit its options.
  2. The canvas area where the screen will be configured. Items can be added by dragged items onto this area from the palette or repository.
  3. The palette is displayed to the right of the canvas and provides all the building blocks you need to create fantastic screens. The palette can be opened using the toolbar.  

Example Page

Here is an example that demonstrates the kind of screen that can be built using PhixFlow. All of what you see is available from the palette and example screens like this are provided in the template packages in the repository. For example. See the Repository → Packages → Theme 2.1 → Dashboards

   

Create a Complete Screen Show  Here we have an example screen that displays the employee details of a company. Many of the elements that make up a screen are preconfigured components that are available from the palette on the right-hand side. It is worth spending some time familiarising yourself with the palette to see what is available. Example screens are provided in the theme package that illustrate what is available, everything on these screens is made using palette items. 

There are several stages to designing an application, as outlined in Building Applications. An application provides users with one or more screens, which they use to interact with data.

A screen is made up of:

  • a dashboard: the empty screen and properties that you want to apply to the whole screen
  • optionally, dashboard elements: these divide a dashboard and enable components in different parts of it to be bound to different data
  • layouts: combinations of components, such as areas, fields, labels, cards, grids and charts, grouped together to create parts of the screen. Layouts start with container components:
    • areas: can contain any other component
    • forms: designed to contain fields and their labels
    • card-containers: designed to contain cards
  • data-bound components: some components are designed to display data. These are:
    • graphs, charts and grids, which are based on views. These components display stream-items:
      • either individually, for example in a grid
      • or combined into a chart or graph
    •  form fields and cards: show several data points (attributes) for a selected stream-item: 
      • either in the fields on a form
      • or in a card.


Screen Fundamentals

In this video we proide you with a short introduction to creating screens.

Binding data to components on a screen requires streams, stream-items and attributes to be present; see the Entity Relationship Diagrams and Views Setup topic for details.

You can build up your own layouts from individual components. However, we recommend that you simply use ready-made layouts that you can drag from the palette onto a screen. Some layouts, called tiles, are specifically designed to resize and move components in response to changes in screen size and device form; see /wiki/spaces/HELP100/pages/9106726483.

Some layouts or components are designed for user interaction, such as buttons. However, you can configure events, such as user-clicks on part of a screen, to trigger actions. For information about configuring user interaction for screens, see Actionflows and Action Configuration.

This topic explains how to:


Pages in this Topic

Other pages in this topic

  • No labels