Watch videos with subtitles in your language, upload your videos, create your own subtitles! Click here to learn more on "how to Dotsub"

07 Creating Program Interfaces

0 (0 Likes / 0 Dislikes)
This section of Introduction to Wolfram Notebooks is a survey of interactive features like pallets and dialog boxes that are commonly found in complete applications. There are many examples of these features in the Wolfram Notebook system itself. For example, here is the hyperlink dialog box that came up in the previous section, which like most dialog boxes is just a collection of interactive controls, like radio buttons and boxes for text input and buttons to cancel or complete the hyperlink. Interactive controls can also be presented in a window called a palette. For example, choosing Special Character under the Insert menu brings up this palette for entering special characters. This palette shows several grids of buttons, with tabs for choosing which grid to display. Clicking any of the buttons pastes that character into the notebook. For complete standalone applications, quite a lot can be done using the Manipulate function. For example, here is a Manipulate result from the Wolfram Demonstrations Project website. This application gives controls for plotting countries of the world based on properties selected from two popup menus. There are also buttons for choosing linear or logarithmic scales for the plot and for choosing whether each country should be shown as a dot or as the flag of the country or as the name of the country. The purpose of this section is to describe a few details of how these interactive interfaces are constructed. Starting with Manipulate, here is a simpler example with two sliders for controlling the position of a point in an image. A potentially more intuitive arrangement of these controls would be to make the control for the vertical coordinate into a vertical slider and position it on the left side of the image, which can be done using the ControlType and ControlPlacement options. The control could also be a two-dimensional slider, which can be specified using Slider2D. There is also a control called a Locator that puts the control right on the image. Returning for now though to the two-dimensional slider, it is easy to imagine extending this example with more controls. For example, this input gives four two-dimensional sliders for controlling opposite ends of two line segments. In examples like this with many controls, it can be useful to organize the controls in some meaningful layout, which can be done using the same layout functions that are used elsewhere in a notebook. One layout function that is useful in this example is Grid, which displays expressions in a two-dimensional grid. The elements in that grid can be anything, including, for example, controls like two-dimensional sliders. To use the Grid function in Manipulate, add curly braces so that the control specifications become elements of an array and enclose that array in Grid. One remaining detail to complete this input is enclosing each slider specification in the Control function. The Control function has previously been unnecessary, but it is needed here to distinguish the lists that specify the controls from the lists that are part of the array, and also to distinguish controls from other layout functions. The result is a display with the sliders arranged in a grid. Functions like TabView can also be used in Manipulate. For example, this uses the TabView function to put each control on a different tab. There are many other ways of labeling and arranging controls. For example, returning to the earlier example, most of the programming here is in the first argument of the Manipulate function. The controls are specified in a few lines at the end. There is a label, followed by a specification that gives a popup menu for choosing the vertical variable in the plot. The next specification gives a control called a setter bar for choosing whether to use a logarithmic scale or a linear scale on the vertical axis. Delimiter draws the lines between groups of controls. After that are similar controls for the horizontal axis, and at the end is a row of buttons for choosing whether to plot each country as a point or as a flag or as the name of a country. The control types are determined automatically based on how the variable is specified. You can use the ControlType option to specify a different control. For example, this specifies that the first scale control should be a RadioButtonBar, rather than a SetterBar. The behavior of the program with the radio buttons is the same as before, but the control for that one variable has a different appearance. There are many other things that can be done with Manipulate. A good source of examples is the Wolfram Demonstrations Project website, where you can find thousands of examples submitted by users, and there are also good tutorials on the Manipulate function in the Wolfram documentation. Manipulate is useful for standalone applications, where the controls and display are all in the same place, but there are many applications where it is useful to put the controls somewhere else. One place to put controls is in a separate window, called a palette. Here is the example shown earlier, which is the special characters palette. This palette is a collection of buttons called paste buttons, which can be generated using a function called PasteButton. For example, this gives a paste button that pastes the letters ABC into the current notebook. You can create a grid of buttons, like the grids in the special characters palette using the Grid function. That grid can then be converted into a palette, using the CreatePalette function. The buttons in that palette can then be used to insert characters into the notebook. This palette could also have been generated by selecting the grid of buttons and choosing Create Palette from Selection under the Palettes menu. Palettes can also include controls other than paste buttons. For example, this input gives a palette with a popup menu for choosing a location and a paste button for pasting the chosen location into a notebook. One common use of palettes is for entering function templates. For example, consider a project where there is some frequently used input, like this input that gives the current temperature and the local time for a location. Rather than entering that entire input for each new location, we could instead start with a template like this, with a small black square called a selection placeholder in place of the location. The small black square is a special character that can be entered in several different ways, one of which is to type a backslash and an open square bracket and then the name of the character. The name of this character is SelectionPlaceholder. The SelectionPlaceholder character appears as soon as the closing square bracket is entered. A palette with a button to enter that template can be generated by first creating the button. In this input, the Defer function is included so that the program does not get evaluated until after a value is inserted for the placeholder. The Defer function, or something that has the same effect, is a common requirement in examples like this one. The result is a button that can be used just by clicking the button and inserting a value for the placeholder, or we could instead start by entering a location, selecting the location, clicking the button to generate the input, which automatically inserts the selection into the template, and then evaluating the resulting input. A shorter label for that button can be entered by including the label as the first argument in the PasteButton function. Then move the button to a palette using the CreatePalette function, which gives a palette with one button. The button in the palette works just like the button that was created earlier. Another interactive way to generate that same result is with a dialog box. For example, here is an input that uses the DialogInput function to generate a dialog box with the popup menu for selecting a location, and clicking Done evaluates the program that generates the time and temperature result. To break that input down a little bit, this input uses the DialogueInput function to give a dialog box with just two buttons, which are created by the ChoiceButtons function. Clicking the Cancel button returns $Canceled, and clicking OK just closes the dialog box. The dialog box can be made to return something by including the DialogueReturn function in the arguments of the ChoiceButtons function. For example, this input gives a dialog box where clicking Done returns a number and clicking Cancel returns the symbol $Canceled. To get the dialog box for time and temperature data, we can modify this program to run the time and temperature program rather than just returning a number, and include a popup menu for selecting the location. Two other modifications in this program are the addition of DynamicModule and the Column function. The Column function is included so that the popup menu and the choice buttons are displayed in a column and DynamicModule is included to localize the variable loc, since the popup menu would otherwise assign a global value to that variable, which could be a problem if a variable with the same name is used somewhere else in the project. Before closing this section, one other place to put interactive controls is in a fixed location at the top of the notebook using a feature called a docked cell. A docked cell can be created by setting the DockedCells option of the current notebook. For example, this input introduces a docked cell with some text. Usually the input for a docked cell is a raw cell expression and not just some text, and the recommended cell style for that cell is DockedCell, as in this input. Docked cells are typically used for controls or for anything else that is used throughout a notebook. For example, here is a notebook with a popup menu for selecting a location and several elements within that notebook that depend on that selection. The TrackedSymbols option is included here so that those elements are only updated when the location is changed, instead of updating whenever there are changes in things like the time or the temperature. This is an example where it could be useful to put the popup menu in a docked cell. Start by setting the cell style to DockedCell using the Style submenu under the Format menu, and then copy the cell by choosing Copy As ▶ Cell Expression from the Edit menu. Then paste that cell into the input that sets the value of the DockedCells option for this notebook. This brings up a dialog box asking if the cells should be interpreted or should be pasted as a cell expression. In this example, the intention is to use the raw uninterpreted cell expression, so select No and then evaluate the resulting input to put the popup menu in a docked cell at the top of the notebook. That's the end of the examples for this section. There is much more to be said about all of the topics that came up in this brief tour of features for constructing interactive program interfaces. A good place to start to find more information in the Wolfram Documentation is this page on Custom Interface Construction, which includes links to documentation for all of the topics that came up in this section.

Video Details

Duration: 10 minutes and 26 seconds
Language: English
License: Dotsub - Standard License
Genre: None
Views: 19
Posted by: wolfram on Jan 23, 2020

07 Creating Program Interfaces

Caption and Translate

    Sign In/Register for Dotsub to translate this video.