Skip to main content
Commonmark migration
Source Link

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

##Background

Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

##What is on topic here

What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Links to guidelines on how to achieve robust dynamic performance of GUI-s.

  • Links to known bugs and workarounds for GUI-related issues, preferably posted as separate Q&A threads.

  • Tips about communication with designer/manager about requirements.

    People are used to the fact that you can create very nice layout with css in no time. How to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

People are used to the fact that you can create very nice layout with css in no time. How to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

##Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

##What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Links to guidelines on how to achieve robust dynamic performance of GUI-s.

  • Links to known bugs and workarounds for GUI-related issues, preferably posted as separate Q&A threads.

  • Tips about communication with designer/manager about requirements.

People are used to the fact that you can create very nice layout with css in no time. How to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Links to guidelines on how to achieve robust dynamic performance of GUI-s.

  • Links to known bugs and workarounds for GUI-related issues, preferably posted as separate Q&A threads.

  • Tips about communication with designer/manager about requirements.

    People are used to the fact that you can create very nice layout with css in no time. How to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

added 187 characters in body; edited tags
Source Link
István Zachar
  • 47.2k
  • 20
  • 145
  • 293

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

##Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

##What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Links to guidelines on how to achieve robust dynamic performance of GUI-s.

  • Links to known bugs and workarounds for GUI-related issues, preferably posted as separate Q&A threads.

  • Tips about communication with designer/manager about requirements.

People are used to the fact that you can create very nice layout with css in no time, how. How to explain that it is impossible, or not worth the time spent, in MathematicaMathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

##Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

##What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Tips about communication with designer/manager about requirements.

People are used to the fact that you can create very nice layout with css in no time, how to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

This post is here to save your time during GUI development in Mathematica. And one way to do this is to know where limits are and to be aware of features that are awaiting.

##Background

Usually I don't have to care (it hurts my brain though) about misaligned details, additional/missing pixels. But currently I'm participating in a project where the design matters and I have to follow examples made by a graphics designer. I have to workaround 10 "features" per hour, and I'm not talking about fancy stuff.

This is intended to be a cheat-sheet for GUI development, based on our experience.

##What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Links to guidelines on how to achieve robust dynamic performance of GUI-s.

  • Links to known bugs and workarounds for GUI-related issues, preferably posted as separate Q&A threads.

  • Tips about communication with designer/manager about requirements.

People are used to the fact that you can create very nice layout with css in no time. How to explain that it is impossible, or not worth the time spent, in Mathematica? How to explain why getting rid of "white line" in some secondary menu took me half a day, and I've failed?

deleted 6396 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751

##Things to keep in mind when developing complex GUI in Mathematica:

  • ###Styles management/inheritance system (StyleSheets and friend)

It is complicated, full of exceptions and only a tip of the iceberg is documented. Those 3 features are limiting the usage of it, which##What is a pity because it has a potential to give a lot. I'm also missing guidelines about common/basic activities related to stylesheets.

How is the cell style of a given cell resolved.

Updating styles based on styles changed in a private stylesheet

How to inspect selected text's style origin?

Not needed Stylesheet locked by the FrontEnd

  • ###Mathematica assumes your dpi == 72 on Windows whether it is so or not.

You can force proper handling of printer's points on HiDPI screens, but are you allowed to do this for the customer's front end? It isn't fully documented and self inconsistent documentation won't help you understand what's going on.

What is a printer's point?

Fontsize is too small

Magnification, ScreenResolution, ScreenInformation and Printing: Please shine some Light into it!

  • ###Mixed units

Printer points and font size units (good luck with tracking what is the current one) are only options. And not both but you have to align two different worlds.

How to convert between various ItemSize/ImageSize units?

  • ###Lack of full control/documentation of Kernel initialization/deinitialization:

Handling Kernel start. Autoload place in init stack.

Handling Kernel quit

How to clean up after a package?

[...] What you cannot do is to make assumptions about the order in which subsequent DynamicModule or Dynamic expressions will fire, or even if they will fire (if they're not in the same position). [...] [...] NotebookDynamicExpression not firing in new kernel sessions [...]

  • ###Issues of a dynamic GUI

Dynamic cells after Kernel restart/quit: Dynamic based GUI will not digest kernel quit well, and you can't do much about that because of the previous section.

Evaluation order of DynamicModule and Manipulate: Particularly handy to know when deciding about when to load static functions and packages.

How Initialization works in DynamicModule

Nesting DynamicModules to properly divide Front-end and Kernel functionality

Create a notebook and save it without prompting Dynamics

  • ###Ignored options

In many gui objects, certain options are ignored.

Grid - problem with ItemSize being ignored

  `SetOptions[GraphicsGrid, Frame -> True]; GraphicsGrid@Array[Graphics@Circle[] &, {2, 2}]`
 

Mathematica graphics

  • ###Misaligned frames, additional pixels, imprecise dimensions

Extra pixels are introduced in many cases, leading to improper dimensions and misalignments.

 `test = Framed["TEST", Background -> Red, FrameStyle -> Blue, ImageSize -> {100, 100}]`

Mathematica graphics

`Column[{#, #, Column[{#, #}, Spacings -> 0]}, Spacings -> 0] & /@ {test[Blue], test[None]}`

enter image description here

ImageDimensions@Rasterize@test
 {100, 102} (* I could live with {102, 102}... *)

Grid cuts my images

enter image description here

TabView Alignment problem for content larger than a view area:

enter image description here

  • ###Transparency and background issues

Transparent bitmaps in controllers bug.

Dynamic graphics appears first with wrong background

DensityPlot and GeoGraphics put a white frame around an inset Button.

{DensityPlot[Sin[x] Sin[y], {x, -4, 4}, {y, -3, 3}, ImageSize -> 100, 
  Epilog -> {Inset[Button["Test"], Background -> None]}],
 GeoGraphics["London", ImageSize -> 100, 
  Epilog -> {Inset[Button["Test"], Background -> None]}]}

Mathematica graphicstopic here

  • ###Further problems

    Links to guidelines making GUI creation process more stable, predictive.

Notebook's WindowSize interference with contents' Dynamic ImageSizes

Problem with CurrentValue["MouseOver"] and Deploy

  • ###OS dependent features

    Tips about communication with designer/manager about requirements.

From my experience it is impossible to create precise GUI for Win and Mac. Not all features are OS dependent, and often workaround for one will give you headache in the other.

Grid layout problems: different sizes when rendering on Mac and Windows

Not needed Stylesheet locked by the FrontEnd


##Question

Are there any guidelines to make GUI creation process more stable?

Quick workarounds are not general enough and I don't have time to spend 1 day to align a simple grid.

If not, what should I tell the designer/manager about requirements?

##Things to keep in mind when developing complex GUI in Mathematica:

  • ###Styles management/inheritance system (StyleSheets and friend)

It is complicated, full of exceptions and only a tip of the iceberg is documented. Those 3 features are limiting the usage of it, which is a pity because it has a potential to give a lot. I'm also missing guidelines about common/basic activities related to stylesheets.

How is the cell style of a given cell resolved.

Updating styles based on styles changed in a private stylesheet

How to inspect selected text's style origin?

Not needed Stylesheet locked by the FrontEnd

  • ###Mathematica assumes your dpi == 72 on Windows whether it is so or not.

You can force proper handling of printer's points on HiDPI screens, but are you allowed to do this for the customer's front end? It isn't fully documented and self inconsistent documentation won't help you understand what's going on.

What is a printer's point?

Fontsize is too small

Magnification, ScreenResolution, ScreenInformation and Printing: Please shine some Light into it!

  • ###Mixed units

Printer points and font size units (good luck with tracking what is the current one) are only options. And not both but you have to align two different worlds.

How to convert between various ItemSize/ImageSize units?

  • ###Lack of full control/documentation of Kernel initialization/deinitialization:

Handling Kernel start. Autoload place in init stack.

Handling Kernel quit

How to clean up after a package?

[...] What you cannot do is to make assumptions about the order in which subsequent DynamicModule or Dynamic expressions will fire, or even if they will fire (if they're not in the same position). [...] [...] NotebookDynamicExpression not firing in new kernel sessions [...]

  • ###Issues of a dynamic GUI

Dynamic cells after Kernel restart/quit: Dynamic based GUI will not digest kernel quit well, and you can't do much about that because of the previous section.

Evaluation order of DynamicModule and Manipulate: Particularly handy to know when deciding about when to load static functions and packages.

How Initialization works in DynamicModule

Nesting DynamicModules to properly divide Front-end and Kernel functionality

Create a notebook and save it without prompting Dynamics

  • ###Ignored options

In many gui objects, certain options are ignored.

Grid - problem with ItemSize being ignored

  `SetOptions[GraphicsGrid, Frame -> True]; GraphicsGrid@Array[Graphics@Circle[] &, {2, 2}]`
 

Mathematica graphics

  • ###Misaligned frames, additional pixels, imprecise dimensions

Extra pixels are introduced in many cases, leading to improper dimensions and misalignments.

 `test = Framed["TEST", Background -> Red, FrameStyle -> Blue, ImageSize -> {100, 100}]`

Mathematica graphics

`Column[{#, #, Column[{#, #}, Spacings -> 0]}, Spacings -> 0] & /@ {test[Blue], test[None]}`

enter image description here

ImageDimensions@Rasterize@test
 {100, 102} (* I could live with {102, 102}... *)

Grid cuts my images

enter image description here

TabView Alignment problem for content larger than a view area:

enter image description here

  • ###Transparency and background issues

Transparent bitmaps in controllers bug.

Dynamic graphics appears first with wrong background

DensityPlot and GeoGraphics put a white frame around an inset Button.

{DensityPlot[Sin[x] Sin[y], {x, -4, 4}, {y, -3, 3}, ImageSize -> 100, 
  Epilog -> {Inset[Button["Test"], Background -> None]}],
 GeoGraphics["London", ImageSize -> 100, 
  Epilog -> {Inset[Button["Test"], Background -> None]}]}

Mathematica graphics

  • ###Further problems

Notebook's WindowSize interference with contents' Dynamic ImageSizes

Problem with CurrentValue["MouseOver"] and Deploy

  • ###OS dependent features

From my experience it is impossible to create precise GUI for Win and Mac. Not all features are OS dependent, and often workaround for one will give you headache in the other.

Grid layout problems: different sizes when rendering on Mac and Windows

Not needed Stylesheet locked by the FrontEnd


##Question

Are there any guidelines to make GUI creation process more stable?

Quick workarounds are not general enough and I don't have time to spend 1 day to align a simple grid.

If not, what should I tell the designer/manager about requirements?

##What is on topic here

  • Links to guidelines making GUI creation process more stable, predictive.

  • Tips about communication with designer/manager about requirements.

added 91 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 362 characters in body
Source Link
István Zachar
  • 47.2k
  • 20
  • 145
  • 293
Loading
added 156 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
Added some dynamic-related issues for reference, however a further [tag:dynamic] is not allowed.
Source Link
István Zachar
  • 47.2k
  • 20
  • 145
  • 293
Loading
added 693 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 693 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 104 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 45 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 1044 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 1044 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 137 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
edited tags
Link
Loading
added 106 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 2 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 152 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
Tweeted twitter.com/StackMma/status/707564107524870144
added 432 characters in body
Source Link
István Zachar
  • 47.2k
  • 20
  • 145
  • 293
Loading
added 50 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 4 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 4 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
added 4 characters in body
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading
Source Link
Kuba
  • 137.7k
  • 13
  • 289
  • 751
Loading