Background page production 01 production of IVX low code sign in system

Make iVX Low code projects need to go online IDE：https://editor.ivx.cn/

One 、 Sign in system thinking

The sign in system generally refers to publishing a sign in link or QR code , Then the user can finish signing in after scanning the code .

How to make it ？ First of all, we can ignore the production of the check-in page , Since there is no clue about signing in , Then we can start by creating a check-in .

To create a check-in, you need a background , Let's make a background page first .

Two 、 Background home page production

Let's first make a backstage , The example of the background homepage is as follows ：

Our sign in mainly includes 3 Features , One is that the user completes sign in 、 The background can publish the sign in and the background administrator can verify the sign in , After verification, it means that the current check-in is correct .

Then we will start to make this background check-in page .

After entering the editor , Click relative application item , Create a relative application , We use relative positioning to make the sign in system . After entering the page, click the front desk , Create a page and rename the check-in system background ：

Then create a row in the background of the check-in system , Name it head , Let's make the header area ：

From the example we can see , There is a certain distance between the text in the header area of the current example and the entire line ：

To complete this function, you need to set the up, down, left and right margins of the row , Or you can directly set the height of the current row , Then center it horizontally and vertically , Here we use the second method , After setting the height, the horizontal and vertical directions are centered , Here you also need to give a corresponding background color ：

Then add a text to it , Set the content of this text to check in to the system background ：

Then create a row named menu under the current page ：

The row needs to be stretched to the current height , And set its background color to transparent ：

Then we make the main contents of the current menu ：

Obviously, this can be completed by one column , Create a column , Name it as operation content ：

Create two elements in the operation content column , One is the picture , Another is text ：

Then the display effect shown in if cannot be completed at this time , Then set the contents of the current column , This is the height and width of the current operation content column 100px, And center it horizontally and vertically ：

Then copy multiple content outline pictures and text ：

You may get the picture too big , You need to set the width of the picture ：

Otherwise, it exceeds the width of the parent container , It will definitely show up .

3、 ... and 、 Create a publishing page

Create a publishing page after the background home page is available ：

The reference of the release page is as follows ：

The overall layout of the release page is similar to that of the home page , We can copy the title and modify the text ：

Then because we didn't do the back menu , Then add a menu option , Just return to the home page ：

We can also add an event to the operation content , This event is a jump page event , Click to jump to the system background home page ：

Then create a row named check-in information :

Here you need to set the height of this row to open , We will add the following check-in contents to this line , Of course, you also need to set the horizontal alignment of its content , To facilitate the next typesetting ：

Then create a row , Name the publication name , Add the corresponding check-in name input box inside ：

Then add a row named check-in time , Add a button and a time selector here ：

In the same way, you can create two more rows and add corresponding contents respectively ：

The button is displayed on the right , We need to set the corresponding horizontal alignment to right ：