Versions Compared

Key

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

This guide shows you how to create a simple screen. 

Anchor
toc
toc

Table of Contents


Introduction 
Anchor
1
1

Use your PhixFlow sandbox to make a simple application. This application will have a single screen, called a layout, that displays data and lets you create, read, update or delete (CRUD) data records. You can additionally add comments.


Some things are already set up for you:

  • a simple model to provide the data.
  • a palette of components that you can drag onto the layout.
  • styles that control the colours and appearance of the screen.

Remember that you can:

  • build models using your own data stored in external databases or files. The Introduction to Modelling Course teaches you how to do this.
  • set up your own styles and palettes to create completely customised layouts. The Building Applications Course goes through this process.



  1. Add buttons for actions
    1. Add a "floating" form to add a description.
    2. Add the action to update stream
    3. Show the form in action - that is is always on top, and that save also closes the pop-up. 
  2. Linking forms together
    1. Add a comments stream to the model
    2. Add comment cards
    3. As layouts are not a fixed structure, but "flow" their order in the repository is important. To reorder an item, you don't drag it in the layout, but in the repository.
    4. Add actions to the card
    5. Show the audit attributes on the card
    6. Add comments on the card.


 Next

Create an Application 
Anchor
2
2

Create your application: It is created with default options



Create the Data 
Anchor
3
3

  1. Pull in an existing file
  2. Advanced: PhixFlow can connect to databases or load from files or...
  3. Open the model and view the data - simple stream
Expand
titleExplore the possibilities
  • Think about data first - ERD
    scroll down the properties - there are lots of options that you can set for your application



Add a View 
Anchor
4
4

  1. Create a view of your data
    1. add dashboard/form/layout
    2. use splitters to lay out the area
    3. Add the grid
    4. Change the attributes shown in the grid - remove the audit attributes
Expand
titleExplore the possibilities

You can show data as a table, but also as charts


                    Back to Contents

               Next  Image Modified


Create forms to edit your data 
Anchor
5
5

  1. Use the palette to add a form (an "inner" form is part of a bigger layout with header, body, footer)
  2. Show that you can edit content (CRUD)
Expand
titleExplore the possibilities

Forms can have headers, footers, bodies, buttons, drop-downs, fields



Anchor
6
6

Create forms to edit your data

Use the palette to add a form (an "inner" form is part of a bigger layout with header, body, footer)

Show that you can edit content (CRUD)


Title 

Anchor
7
7

text

Title 

Anchor
8
8

text

Title 

Anchor
9
9

text

Title 

Anchor
10
10

text

Title 

Anchor
11
11

text

Title 

Anchor
12
12

text

Title 

Anchor
13
13

text

Title 

Anchor
14
14

text

Title 

Anchor
15
15

text

Title 

Anchor
16
16

text