Page MenuHomePhabricator

Skin feature for MITK
Closed, ResolvedPublic

Description

support different layout designs e.g. a "dark" user interface for M3M.

Event Timeline

[SVN revision 19546]
ENH (#2662): added support for skins/themes in Qt based MITK applications.

A custom skin consists of three files:

  • <skinname>.qss The style for the whole application
  • <skinname>-tab.qss The style for the view and editor tabs
  • <skinname>-activetab.qss The style for active view and editor tabs

Look at org.opencherry.ui.qt/resources for an example.

You can add a new skin using these two methods:

1.) Add a "built-in" skin in your custom cherry::QtWorkbenchAdvisor like:

void
QmitkExtAppWorkbenchAdvisor::Initialize(cherry::IWorkbenchConfigurer::Pointer configurer)
{

cherry::IQtStyleManager::Pointer styleManager = cherry::Platform::GetServiceRegistry().GetServiceById<cherry::IQtStyleManager>(cherry::IQtStyleManager::ID);
styleManager->AddStyle(":/org.mitk.gui.qt.extapplication/darkstyle.qss");

QmitkWorkbenchAdvisor::Initialize(configurer);

...

}

where darkstyle.qss contains Qt stylesheet declarations compiled into a Qt resource (all three .qss files must be compiled into the resource file).

2.) Put the three .qss files into a directory and add the directory in the "Edit -> Preferences" Dialog under the "Themes" entry. This allows for a on-the-fly change of the skin (to see a change in the tab styles, you have to click on them once).

[SVN revision 19598]
FIX (#2662):

  • added the UpdateTheme() method to cherry::IWorkbench to support changing the current Qt style on the fly for the whole application (especially tabs).
  • overwriting paintEvent(QPaintEvent*) in cherry::QtSash to support stylesheets
  • fixed a bug in QtStylePreferencePage when adding a new search path (the styles found where not added to the style manager and the combobox)

[SVN revision 19626]
FIX (#2662): Setting the current style now in the style manager constructor, such that it is initialized.

@Hannes: please report everything you know here, Jan will have a look at it.

Three different simple themes

What you need are the files as mentioned in commend #2 from Sascha. I played around with the Qt paletts (dark, shadow, light, etc. see Qt Doku) but for a really nice skin you have to use own colours for the different widgets.

A good basis for starting such an own theme is the pagefold.qss (very edgy) or the current default theme.

Status: works for almost all widgets, but ImageStatistics histogram plot. Possible solution (working now on it): turn off the skin-feature for VTK-based widgets, e.g. the histogram plot, direct in the .qss style file

Status-Update: the QxtSpanSlider is not completely drawn when using the 'newtheme' for MITK.
Possible cause is the fix of the T3355 (for release_1.0 ), where the style of the spanslider gets directly set in the

QmitkTransferFunctionWidget::QmitkTransferFunctionWidget()

through

m_RangeSlider->setStyle( sliderStyle );

Resetting all bugs without active assignee flag to "CONFIRMED". Change status to IN_PROGRESS if you are working on it.

The status of the bug is the same as of (In reply to comment #8)

Status: works for almost all widgets, but ImageStatistics histogram plot.
Possible solution (working now on it): turn off the skin-feature for VTK-based
widgets, e.g. the histogram plot, direct in the .qss style file

This issue is still not resolved.

Results of discussion in the MITK meeting:

  • This bug is still current! it would still be nice to have a skin feature
  • Main problem now is the VTK histogram widget. Next step would be to check if something has been changed there on VTK side. Maybe it would also be a good idea to exchange this widget, since it is not working atm anyway (see T8320)

Work here can be done at bugsquashing party

Rostislav has provided us with a dark theme that works for his application.

Known issues (by him):

  • DoubleSlider does not work

Some things I noticed :

  • The image navigator spin boxes to the right of the sliders as well as some other spin boxes should be adjustet. Currently they look just like for the default theme, only the numbers are in a black frame
  • greyed out menu items are very hard to read (such as save if no image is selected)
  • The file open/save dialog still has the default theme
  • The headings in the preferences dialog need their colors adjusted
  • the image statistics histogram needs work
  • movie maker labels are nigh on impossible to read
  • logging view contrast could be better for the lighter grey rows
  • link color needs to be changed (e.g. about dialog)
  • we might to provide white versions of the awesome icons, take a look at the high contrast icons CAI had designed

His comments regarding attribution/distribution:

I think putting it into a repository and making it available in MitkWorkbench would make sense.
Regarding the attribution, I think adding a remark to this page:
http://docs.mitk.org/2015.05/GUICustomization.html saying something like "You can look for an example of a complete stylesheet in %source_code_location%. The dark stylesheet was contributed by Rostislav Khlebnikov based on the darkorange stylesheet developed by Yasin Uludag http://www.yasinuludag.com/" or something like that.

Just a couple of notes.

It is a DoubleRangeSlider (with two handles) that doesn't work well. The DoubleSlider is fine.

I'm not sure that it's possible to use the theme for open/save dialogs as Qt uses system calls, unless a special flag is specified to use Qt-ones, which in general have much inferior performance.

User goch has pushed new remote branch:

bug-2662-replace-pusbuttons-in-toolbar-with-toolbuttons

[122219]: Merge branch 'bug-2662-replace-pusbuttons-in-toolbar-with-toolbuttons'

Merged commits:

2015-08-10 19:13:07 Rostislav Khlebnikov [8edaec]
Render window menu modifications for dark theme

Signed-off-by: Rostislav Khlebnikov <r.khlebnikov@gmail.com>

Please take note of my comment at rMITKc7697f1e47d1 and remember to replace the hard coded paths.

kirchnth claimed this task.

merged the largely finished darktheme-skin to master
Its pretty.
Try it!
And please assign me stuff that doesnt work directly.