1. Outline

When considering features like inspections, workflow, etc., we want to keep input as simple as possible, assuming that we will be working while holding a smartphone.

If it is a pull-down menu when you want to be able to make routine entries or enter statuses,

The more items that need to be input, the more stressful it becomes for the user.

In such cases, a button with a function that changes status when tapped or clicked, rather than a pull-down menu, would allow users to input data with one hand, reducing the stress of the task.

【screen】Sample of buttons that change display when tapped/clicked

The sample illustrates how to create a button that switches between "X," "Y," and "D" by tapping or clicking on it.

2. Creation Procedure

Create a button that changes display when tapped/clicked

Unifinity can achieve this by using the following features together

Screen: "Button" control
Processing: Dictionary

2.1. Prepare images for buttons

Place the button to be used.

In the sample, register images for three types of buttons in "Resources" and set values for each in "Keywords. In the sample, "circle," "triangle," and "cross" are set.

This value is used in 【Processing】.

Buttons do not necessarily have to be images, and text can be switched instead of images.

2.2. Create a process

Use "dictionary" to create a process that switches the display on tap/click.

2.3. Preparation of dictionaries for buttons

Select "Dictionary/Create" from [Components].

Enter the "Keyword" set in "Resource" in the "Keyword" field and the "Keyword" for the button you want to display next after tapping or clicking in the "Value" field.

In the sample, we want to display "○", "△", and "Dis" to be repeated in that order, so we set it up as shown on the screen.

If you want to add more display patterns, click "Add Element" and set "Key" and "Value".

2.4. Add movement to buttons

Create a process for when a button is tapped or clicked.

2.5. Assign the created process to a button

Return to the【【Screen】and embed the process you created into the button.

With the placed button selected, set the process you created (in the sample, it will be "Logic that changes image when tapped/clicked") from "Execution Process" in the "Behavior Settings" tab in the "Object" section.

You can check the actual operation by pressing the "Run (F5)" button in Unifinity Studio, so please try it out.

3. Reference

The sample uses "○", "△", and "Dis" images, but it is not necessary to use images, and it is also possible to use a process in which an arbitrary string of text is switched.

The following patterns are possible in actual operations.

Approve," "Reject," "Pending."
In stock, out of stock, inquiring
Borrowing, Returning, and Receiving.
In Use, Inventory, Lost.
Under Inspection," "Replacement Needed," or "Failure."

The sample includes a screen that assumes "inspection work".

We hope this will be helpful for your application development.

4. Sample application

You can download it from the following link