Improving the User Interface
While it is perfectly functional, the app is rather wasteful of screen real estate and it would be a better approach to let the user select a share type from a drop-down list before changing its estimated ROI.
Doing this requires a slight change to the model, and this illustrates the iterative nature of Xpress Insight solution development. Start with a basic model, create an interface and iterate both as you seek to improve the user experience.
The model needs a scalar entity in which to store the selected share name from the proposed drop-down list. Modify the
declarations section of
foliodata.mos by declaring the entity
changeShare, adding it at the bottom:
declarations ... RET: array(SHARES) of real !@insight.manage input changeShare: string end-declarationsFor this example, a simple way to initialize it is by modifying the datainput procedure so that it now defines an initial value for the new scalar:
! Load input data
procedure datainput
initializations from DATAFILE
RET RISK NA
end-initializations
changeShare:= "brewery"
end-procedure Replace the
<vdl-form> containing the repeating fields, with a new form containing just two fields, so that the full
foliodata.vdl file now reads:
<vdl version="4.1">
<vdl-page>
<vdl-section heading="Welcome to Portfolio Optimization"
heading-level="1">
<vdl-section heading="Return per share"
heading-level="2">
<vdl-form>
<vdl-field entity="changeShare"
options-set="SHARES"
label="Choose share type"></vdl-field>
<vdl-field entity="RET"
indices="=scenario.entities.changeShare.value"
label="Estimated ROI"></vdl-field>
</vdl-form>
<vdl-execute-button caption="Run scenario"></vdl-execute-button>
</vdl-section>
<vdl-section heading="Optimal result" heading-level="2">
<span vdl-text="Calculated optimal return: "></span>
<span vdl-text="=insight.Formatter.formatNumber(
scenario.entities.Return.value, '.##')">
</span>
</vdl-section>
<vdl-section heading="Recommended share allocations"
heading-level="3">
<vdl-table page-mode="paged" page-size="5"
show-filter="true"
column-filter="true">
<vdl-table-column entity="frac"></vdl-table-column>
<vdl-table-column entity="RET"></vdl-table-column>
</vdl-table>
</vdl-section>
</vdl-section>
</vdl-page>
</vdl> The first new
<vdl-field> element has its
entity attribute set to
changeShare - the new entity in the model. By using the
options-set attribute,
Xpress Insight is informed that the field should be a drop-down list, taking its set of options from the
SHARES set. The field is completed with the assignment of a label.
The second new <vdl-field> element references the RET array, with its indices attribute set to the value stored in the changeShare entity. Again, a suitable label is provided.
Republish,
reload and rerun the scenario:
Improving the User Interface
The result is a much more compact user interface that conforms better to expectations.
Should you need them, radio buttons and checkboxes are available as alternative VDL field types.
