Group Abstract Group Abstract

Message Boards Message Boards

[WSG21] Daily study group on creating custom user interfaces

POSTED BY: Abrita Chakravarty
87 Replies
Sort By:
Gerald Dorfman
Gerald Dorfman
Posted 4 years ago

Rohit, Thanks. Gerry
POSTED BY: Gerald Dorfman
Gerald Dorfman
Gerald Dorfman
Posted 4 years ago
POSTED BY: Gerald Dorfman
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

Hi Gerald,

You were close.

Manipulate[
 Grid[
  {{Style["a = " <> ToString@a, 20]},
   {ContourPlot3D[x^2 + y^2 + a z^3 == 1, {x, -2, 2}, {y, -2, 2}, {z, -2, 2}, 
     Mesh -> None, 
     ImageSize -> Medium]}
   }],
 {{a, -2, Style["a", 16]}, -2, 2}]

Also increased the size of the label for the control.
POSTED BY: Rohit Namjoshi

Thank you so much, Jayanta.

Pål
POSTED BY: Pål Lillevold

John again,

No need to answer. On viewing the last session recording I learned callKernel is a dummy variable.

Thanks for the very useful / helpful course materials.
POSTED BY: John Burgers
POSTED BY: John Burgers
POSTED BY: Pål Lillevold
POSTED BY: Jayanta Phadikar

Thank you so much, Vincent!
POSTED BY: Pål Lillevold
Tom Blanton
Tom Blanton
Posted 4 years ago

This course exceeded my expectations. Thanks to everyone who worked to make it a success. Great job!
POSTED BY: Tom Blanton
POSTED BY: Andreas Rudolph

Hi,

When the following code: checkboxBarTest = CheckboxBar[{i, 0, 20, 2}, {i, 0, 20, 2}] is deployed to a CDF, the CDF when opened responds with an undesired "Enable Dynamics" confirmation request.

How can this be avoided?

Thank you in advance and best regards

Attachments:
checkboxBarTest.cdf
checkboxBarTest.nb
POSTED BY: Pål Lillevold

Hi, there, you can try go to preference dialog, at the security tab, under notebook security, edit trusted directories, put your cdf under one of these trusted directories, then open the cdf files again, the enable dynamic will disappear. this is the simplest way to do it as a Mathematica user,

here are the two technical links on this topic: stackexchange newsgrouparchive
POSTED BY: vincent feng
Tom Blanton
Tom Blanton
Posted 4 years ago

Is there a way to verify that my quiz results have been recorded?
POSTED BY: Tom Blanton

I took a screenshot of each my quiz test at the final parts, I passed three this Friday. This course is fantastic on making new experience for the user. A lot of coverage, I will review the relevant materials once I have spare times.

Thanks.
POSTED BY: vincent feng

Hi Tom,

As long as you see a passing score after hitting "Get Results", your score has been sent to a Databin for review by the Wolfram U team. Quiz scores will be reviewed the week of Oct. 4th and certificates sent shortly thereafter. If you do not receive your certificate, please send an email to wolfram-u@wolfram.com, we can pull the data and double check at that time.

POSTED BY: Cassidy Hinkle

Was a recording made of today's (Fri, 24 Sep) presentation?
POSTED BY: Matthew Heaney
Doug Beveridge
Doug Beveridge
Posted 4 years ago

can somebody please confirm if recording was made?
POSTED BY: Doug Beveridge

Hi Doug, All the sessions from the series have been publish for review. You can go to the series landing page and choose which you'd like to review. You'll be taken to the session page and can hit the play button to begin watching. Please let us know if you have further questions.

POSTED BY: Cassidy Hinkle

Week 3 Recap, Live UI Development and Mini Projects Solutions is not available.
POSTED BY: Artin Hatzikioseyian
Gerald Dorfman
Gerald Dorfman
Posted 4 years ago

The following code has two problems. extra frame lines inside the SetterBar display are generated and the Dynamic[inputs] appears as a variable name in the blue bar rather than as the value. What is wrong and what are the fixes?

ClearAll["Global`*"]; 
framed[x_] := 
 Framed[x, Alignment -> Center, Background -> GrayLevel[0.96], 
  ImageSize -> {75, 25}, FrameStyle -> None, 
  FrameMargins -> Automatic, BaseStyle -> Bold, 
  FrameStyle -> Directive[None]];
DynamicModule[{input},
 Column[{
   Framed[Dynamic[input], Alignment -> Center, 
    Background -> LightBlue, ImageSize -> {345, 35}, 
    FrameStyle -> None, FrameMargins -> None, BaseStyle -> Bold],
   SetterBar[Dyanmic[input],
    framed[#] & /@ {"(", ")", "X", "AC",
      7, 8, 9, "/",
      4, 5, 6, "*",
      1, 2, 3, "-",
      0, ".", "=", "+"},
    Appearance -> "Horizontal" -> {5, 4} , Background -> White
    ]
   },
  Frame -> True, BaseStyle -> BackGround -> White]
 ]
POSTED BY: Gerald Dorfman

We will be distributing the solutions to the projects in Session 14.
POSTED BY: Jayanta Phadikar
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

Hi Gerald,

I see a couple of typos. Dyanmic[input] should be Dynamic[input], and BaseStyle -> BackGround -> White should be BaseStyle -> Background -> White
POSTED BY: Rohit Namjoshi

Attendees in the daily study group had asked about the palette used to delete outputs during presentation. DeleteAllOutputPalette is now present in the Wolfram Function Repository. https://resources.wolframcloud.com/FunctionRepository/resources/DeleteAllOutputPalette/
POSTED BY: Kunal Khadke

I experiment with PaneSelector command with a toy example which works as expected: i.e.

DynamicModule[
 {x = 1},
 Column[{
   SetterBar[Dynamic[x], {"Don't press this", 1, 2, 100, "Hi there"}],
   PaneSelector[{"Don't press this" -> "I said DONT PRESS !!!", 
     1 -> "One", 2 -> "Two", 100 -> "You Pressed One Hundred", 
     "Hi there" -> "What is your name ?"}, Dynamic[x]]
   }]

However when I wrap the Speak function around the text to hear the message it is played directly once and is not executed when pressing the tab.

DynamicModule[
 {x = 1},
 Column[{
   SetterBar[Dynamic[x], {"Don't press this", 1, 2, 100, "Hi there"}],
   PaneSelector[{"Don't press this" -> Speak["I said DONT PRESS !!!"],
      1 -> "One", 2 -> "Two", 100 -> "You Pressed One Hundred", 
     "Hi there" -> "What is your name ?"}, Dynamic[x]]
   }]
 ]
 ]

What is going on here ?
POSTED BY: Artin Hatzikioseyian
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

PaneSelector evaluates its arguments before the selector is rendered, they are not re-evaluated when a selection is made. e.g. the random values do not change

DynamicModule[{x = 1}, 
 Column[{SetterBar[Dynamic[x], {"Don't press this", 1, 2, 100, "Hi there"}], 
   PaneSelector[{"Don't press this" -> "I said DONT PRESS !!!", 
     1 -> RandomInteger[10], 2 -> RandomReal[], 100 -> "You Pressed One Hundred", 
     "Hi there" -> "What is your name ?"}, Dynamic[x]]}]]
POSTED BY: Rohit Namjoshi

Thank you for your comment. So there is no chance to play the sound each time I select the setter bar and not at the begining.

POSTED BY: Artin Hatzikioseyian

Use the second argument of Dynamic:

DynamicModule[{x = 1},
 Column[
  {
   SetterBar[
    Dynamic[x, 
     If[# == "Don't press this", Speak["I said DONT PRESS !!!"]; 
       x = #, x = #] &],
    {"Don't press this", 1, 2, 100, "Hi there"}],
   PaneSelector[
    {"Don't press this" -> "", 1 -> "One", 2 -> "Two", 
     100 -> "You Pressed One Hundred", 
     "Hi there" -> "What is your name ?"}, Dynamic[x]
    ]
   }
  ]
 ]
POSTED BY: Jayanta Phadikar

Question: Today you pointed out that ImageSize -> Automatic helps speed up slow interfaces. Could you please explain why?
POSTED BY: Zbigniew Kabala

Wrapping the contents with Dynamic and setting ImageSize->Automatic make the contents evaluate only when the particular tabs are clicked. Without these settings, TabView or PaneSelector evaluates all the contents before displaying. Thus the settings help in reducing the initial loading time.

Some more details can be found here: tutorial/Views#23068646
POSTED BY: Jayanta Phadikar

Thank you everyone for your continued and enthusiastic participation in this week's sessions.

Now that we have covered the fundamental concepts of UI development and looked at various UI examples, in the next week we will focus on best practices and various general tips and tricks.

We will start with various deployment practices, then move on to a host of tips & tricks for speeding up interfaces, making our interfaces aesthetically pleasing, improving the user experience, and more.

Looking forward to your active participation in the next week!

We appreciate all the feedback that you have been giving (either positive or negative). These encourage us to continue to serve our user community, and do it even better in the future!!!
POSTED BY: Jayanta Phadikar
Tom Blanton
Tom Blanton
Posted 4 years ago

Thanks, Jayanta. Very helpful. Looking forward to Session 10.
POSTED BY: Tom Blanton
Tom Blanton
Tom Blanton
Posted 4 years ago

I would like to develop UI's that clients can use with Wolfram Player. From the class yesterday it seems that DynamicModule could be used in this way. Is this correct?

ETA: I would like to keep my functions proprietary, i.e. the client would not be able to see the code.
POSTED BY: Tom Blanton
POSTED BY: Jayanta Phadikar
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago
POSTED BY: Rohit Namjoshi
POSTED BY: Pål Lillevold
Doug Beveridge
Doug Beveridge
Posted 4 years ago

Jayanta where can we find that utility you use to close the output windows?

enter image description here
POSTED BY: Doug Beveridge

After you downloaded/unpacked the course material you find it as "OutputDeleteUtility.wl" in folder "Supporting Files"
POSTED BY: Andreas Rudolph
jeremy kirton
jeremy kirton
Posted 4 years ago
POSTED BY: jeremy kirton
Updating Name
Updating Name
Posted 4 years ago
POSTED BY: Updating Name
Gerrie Shults
Gerrie Shults
Posted 4 years ago
POSTED BY: Gerrie Shults
POSTED BY: Jayanta Phadikar

Is it permissible to Overlay a control onto a graphic?

For the "Car Game" I created a background image as a graphic object and the "start"/"Stop" controller

background = Graphic[...] control = ... which toggles as in the car game demo,

But the control can't be used when these are packaged together using 

Overlay[{
  background,
  control
  }, Alignment -> {Center, Bottom}]

Thanks.
POSTED BY: John Burgers
POSTED BY: Jayanta Phadikar
POSTED BY: John Burgers

Yes it seems that the controls from only one layer can be activated. You can however use Row/Column/Grid in that layer for keeping multiple controls.
POSTED BY: Jayanta Phadikar

Where should I put the Dynamic to control the appearence or not of the frame in this toy manipulate example:

Manipulate[
 x,
 {x, 0, 1},
 {{frmd, False}, {True, False}},
 Paneled -> frmd
 ]
POSTED BY: Artin Hatzikioseyian
POSTED BY: Jayanta Phadikar

Jayanta, thank you very much for the instructive reply.

POSTED BY: Artin Hatzikioseyian
Raymond Low
Raymond Low
Posted 4 years ago
POSTED BY: Raymond Low

Hi Raymond,

Sorry to hear you faced some issues with the webinar session today. We do use poll questions to allow our attendees to interactively respond during the study group. But they should not interfere with the webinar itself in anyway or prevent it from starting up. If you run into the issue again, please email us at wolfram-u@wolfram.com and we can try to troubleshoot it.

POSTED BY: Abrita Chakravarty

How would you set up two columns where the left column is text and the right column is Mathematica commands such as In/Out. This is format was used by S. Wolfram in his Mathematica Book 4th edition.
POSTED BY: Charles Glover
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago
POSTED BY: Rohit Namjoshi
POSTED BY: Charles Glover

Jayanta, Rohit, Many thanks for your help.

Jorge O
POSTED BY: Jorge O. Garcia L
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago
POSTED BY: Rohit Namjoshi

Dear Friends, how can I obtain the same type of sliders and light gray color in the final graphic if I'm using the same code? Do I need to change some initial setting?

Many thanks.

Attachment

Attachments:
Sliders.png
POSTED BY: Jorge O. Garcia L

Yes by default the appearances are OS dependent. We can set a generic appearance which should be independent of the OS:

Style[Slider[Dynamic[x]], ControlsRendering -> "Generic"]
POSTED BY: Jayanta Phadikar

Thank you for your reply. I think in the option inspector should be "somewhere" an option for the default FontSize to be set at 12 globally or for a notebook.

POSTED BY: Artin Hatzikioseyian

In few examples from the tutorials in Windows 10 I have a couple of appearence issues: For example in the figure below enter image description here

The controls are truncated.

In the next simple command the x symbol at the left appears very small. enter image description here

Both examples are at 100% (zoom) magnification level. Obviously there is a matter of scaling in a laptop screen. All the values at the preferences are in the default values.

POSTED BY: Artin Hatzikioseyian
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

I don't use Windows so I cannot help with the first issue. For the second one the styling can be changed e.g.

Manipulate[x, {x, 1, 3}, 
 LabelStyle -> Directive[Red, FontSize -> 24, FontFamily -> "Verdana"]]
POSTED BY: Rohit Namjoshi
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

The name is just text that is intended to describe whatever is relevant to all the available actions. It is not a default selection. It is up to the programmer to use text that is appropriate and not misleading. A name of "10!" is misleading since that is not the only available action. In the documented example perhaps a better name would be "Select a factorial to compute". Or maybe

Table[ActionMenu[
  Tooltip["Factorials", "Select a factorial to compute"],
  {"4!" :> Print[4!], "7!" :> Print[7!], "10!" :> Print[10!]}, 
  Appearance -> a], {a, {None, Automatic, "PopupMenu", "Button"}}]

This results in a very bad user experience because the menu label matches one of the choices

Right, so don't do that. :-)

Perhaps ActionMenu is not the right control to use for what you are trying to accomplish. Can you describe the behavior of the UI that you need?
POSTED BY: Rohit Namjoshi
Updating Name
Updating Name
Posted 4 years ago
POSTED BY: Updating Name

I agree that the documentation could be more clear on this regard. I am forwarding a request to our Technical Support department so that a suggestion report could be filed and the documentation/function could be improved in the future.

Note that we can always add our own code on top of the existing function for extending the set of features. Here is an example of a custom ActionMenu which I think is closer to what you need:

SetAttributes[myActionMenu, HoldRest];
myActionMenu[name_, list_] :=
 DynamicModule[{x = name},
  PopupMenu[
   Dynamic[
    x,
    (x = #; list[[Position[list[[All, 1]], x][[1, 1]], 2]]
      ) &], list[[All, 1]]
   ]
  ]

The following will behave like an ActionMenu, however the "name" or "7!" will be pre-selected in the menu:

myActionMenu["7!", {"4!" :> Print[4!], "7!" :> Print[7!], 
  "10!" :> Print[10!]}]

I should mention that I have not spent a lot of time in ensuring that the function is stable in different circumstances. The purpose was to give a hint for the solution.

Examples of such custom control objects can be found in the Wolfram Function Repository (I believe that Soumya had discussed during the presentation as well) - see e.g. StyledCheckboxBar.
POSTED BY: Jayanta Phadikar
Gerrie Shults
Gerrie Shults
Posted 4 years ago

Thank you, Jayanta. I appreciate the example. I'm still learning what I can do without customization, but when I'm finally building something, I may also want to customize.
POSTED BY: Gerrie Shults
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

name is the first argument to ActionMenu. From the example under Options / Appearance

Table[ActionMenu[
  "Factorials", {"4!" :> Print[4!], "7!" :> Print[7!], "10!" :> Print[10!]}, 
  Appearance -> a], {a, {None, Automatic, "PopupMenu", "Button"}}]
POSTED BY: Rohit Namjoshi
Gerrie Shults
Gerrie Shults
Posted 4 years ago

This example still doesn't answer my question, but I now see the problem is that the documentation is wrong (though some will probably argue that it's just highly misleading). The first argument, name is used in exactly the same way in all 4 Appearance options.

Based on the description of the Appearance option setting "PopupMenu"

display like a popup menu with initial value name

executing the following

ActionMenu[ "10!",
  {"4!" :> Print[4!], "7!" :> Print[7!], "10!" :> Print[10!]}, 
  Appearance -> "PopupMenu"]

should show a popup menu labeled 10!, such that I could click it and the menu choice 10! would be selected. But that's not what happens, the first choice, 4! is selected. This results in a very bad user experience because the menu label matches one of the choices, but the user still has to manually select that choice.

The description implies, and I would expect, that the choice 10! should be preselected when the menu is clicked.
POSTED BY: Gerrie Shults
Gerrie Shults
Gerrie Shults
Posted 4 years ago

I asked the question in today's session:

The documentation for ActionMenu says that Appearance->"Popover" will let you select the default value, but I can't find out how to do that.

I was referring to the following setting choice for the Appearance option:

"PopupMenu" display like a popup menu with initial value name

Where can I specify name?
POSTED BY: Gerrie Shults

Is it safe to try the quiz now? Is it grading correctly?
POSTED BY: James Choi

I am sorry, could someone post the link to the quiz? I can not find it on the group. Thank you and sorry for the added noise!
POSTED BY: Rui Alves
Gerald Dorfman
Gerald Dorfman
Posted 4 years ago

POSTED BY: Gerald Dorfman
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

It does not work because of a typo. Delimiter, not Delimeter.
POSTED BY: Rohit Namjoshi

[Cmd]+[.] unfortunately can't always abort a given computation instantly. The abortion request goes to the kernel instantly, but depending on the type of computation the kernel is busy with it may check the queue of requests frequently or infrequently. Besides, the abortion itself may take some time.

That said I did not encounter any such problems with Exercise 3. If we are using preemptive evaluation, we should get an $Aborted in 6 secs. With queued evaluation I get back the image in about 10 seconds (this time will depend on your internet connection).

You may want to check:

Options[EvaluationNotebook[], DynamicEvaluationTimeout]

If the value is not 6, I would recommend resetting it to 6 unless you are using it specifically for some purpose.

You can also try quitting the kernel: Evaluation -> Quit Kernel
POSTED BY: Jayanta Phadikar
Avery Kramer
Avery Kramer
Posted 4 years ago

I know Jayanta mentioned how to abort the evaluation once it gets in a loop. I tried command + "." (Mac) but wasn't having much luck. I'm working on Exercise 3 on Dynamics II and have had to restart MMTA twice now.

Thanks in advance
POSTED BY: Avery Kramer

Thank you everyone for your enthusiastic participation in this week's sessions. I hope that you have been enjoying and finding the sessions helpful.

In this week, we covered some fundamental concepts of dynamics and Manipulate.

In the next week, we will discuss more about certain pragmatic concepts related to the development of User Interfaces and look at several User Interface examples.

Our apologies for few things here and there not working properly in the notebooks. We are making the corrections and will make an updated set of notebooks available to you at the end of the series.
POSTED BY: Jayanta Phadikar
Gerrie Shults
Gerrie Shults
Posted 4 years ago

Today's quiz is a disaster. My answers to questions 2, 5, 9 and 10 are being ignored. I can change my answers to any of these and my score remains unchanged.
POSTED BY: Gerrie Shults
Gerrie Shults
Gerrie Shults
Posted 4 years ago

Also, according to the Day 1 notebook, Introduction, slide 8, item 2 under Entirely cloud-based interfaces, the answer to question 3 is being graded incorrectly.
POSTED BY: Gerrie Shults

Any idea when the quiz is due? I don't see a due date listed in any of the materials. Thanks.
POSTED BY: Timothy Ewing
Rohit Namjoshi
Rohit Namjoshi
Posted 4 years ago

Hi Gerrie,

Yes, I agree, grading is messed up on questions 2, 5, 9, 10.
POSTED BY: Rohit Namjoshi

I have the same issue. In other study groups the due date came after the course was finished.So, it is probably not an issue in this regards.
POSTED BY: Andreas Rudolph
POSTED BY: Abrita Chakravarty
Tom Blanton
Tom Blanton
Posted 4 years ago
POSTED BY: Tom Blanton 
Dynamic[
 If[stop == 0,
  Button[Style["Start", 20], stop = 1, Background -> LightGreen, 
   ImageSize -> {80, 40}],
  Button[Style["Stop", 20], stop = 0, Background -> LightRed, 
   ImageSize -> {80, 40}]]
 ]
POSTED BY: Timothy Ewing
POSTED BY: Jayanta Phadikar

Looking for something like this?

Manipulate[
 Graphics[{
   LABColor[lightness, a, b],
   Opacity[opac],
   Disk[]}],
 {lightness, 0, 1}, {{a, 0}, -1, 1},
 {{b, 0}, -1, 1}, {{opac, 1}, 0, 1}]
POSTED BY: James Choi

I am wondering is there a way to vary what type of color setter is presented to the user with the Manipulate function. For example, is it possible to use a LAB Color setter instead of the default color selector in the Manipulate function? enter image description here
POSTED BY: Peter Burbery
POSTED BY: Lou D'Andria
Reply to this discussion
Community posts can be styled and formatted using the Markdown syntax.
Tag limit exceeded
Note: Only the first five people you tag will receive an email notification; the other tagged names will appear as links to their profiles.
Reply Preview
Attachments
Remove
or Discard