Xnview MP Dark UI Enhancement

Plug-ins, add-ons, skins, icons, templates and other downloads. Contributions are welcome.

Moderators: XnTriq, helmut, xnview

arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Changing View Background Color

Post by arabtornado »

I'm Working on enhancing the dark theme of Xnview MP to look like Photoshop CS6, but how can i change the white background of view layout, and also how can i change the background color of thumbnils in the browse layout and also the preview background in the browse Layout. I know that it's from style_sheet.qss but i looked at it and i didn't find the color value of those parts in that file

Image
User avatar
xnview
Author of XnView
Posts: 43326
Joined: Mon Oct 13, 2003 7:31 am
Location: France
Contact:

Re: Changing View Background Color

Post by xnview »

Ok, currently not in the style but in option/Browser
Pierre.
User avatar
XnTriq
Moderator & Librarian
Posts: 6336
Joined: Sun Sep 25, 2005 3:00 am
Location: Ref Desk

Re: Changing View Background Color

Post by XnTriq »

  1. Tools » Settings... » Browser » File List » Item colours » Default color
  2. Tools » Settings... » Browser » Thumbnail » Appearance
  3. %ProgramFiles%\XnViewMP\UI\style_sheet.qss (default settings) » line #419
    %AppData%\XnViewMP\style_sheet.qss
    %AppData%\XnViewMP\style_sheet_win.qss
[color=green]style_sheet.qss[/color] wrote:

Code: Select all

QListView {
background-color: #RRGGBB;
background-color: rgb(RRR, GGG, BBB);
}
arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Xnview MP Dark UI Enhancement

Post by arabtornado »

I'm working on enhancing the dark UI of Xnview MP to make it looks like Photoshop CS6 i changed the original color from black to dark gray and changed all the lines and borders from solid black lines to 3d lines "groove style" and made many other minor twikes, if you like it then it will be great to help me to enhance it, and for admin, if you really like the improvement then fell free to add it as official Theme in the next Xnview MP versions

Image Image

as you can see there is a few mistakes i can't edit so hope you help me to improve it, which is, padding the lower toolbar in the browse view and enhane the look of the search bar, and finally how to change the icons of the toolbar.
User avatar
xnview
Author of XnView
Posts: 43326
Joined: Mon Oct 13, 2003 7:31 am
Location: France
Contact:

Re: Xnview MP Dark UI Enhancement

Post by xnview »

arabtornado wrote:as you can see there is a few mistakes i can't edit so hope you help me to improve it, which is, padding the lower toolbar in the browse view and enhane the look of the search bar, and finally how to change the icons of the toolbar.
Which padding? You have other icons??
Pierre.
User avatar
XnTriq
Moderator & Librarian
Posts: 6336
Joined: Sun Sep 25, 2005 3:00 am
Location: Ref Desk

Re: Xnview MP Dark UI Enhancement

Post by XnTriq »

arabtornado wrote:[…] i changed the original color from black to dark gray and changed all the lines and borders from solid black lines to 3d lines "groove style" and made many other minor twikes […]
I really like the enhancements you've done so far and hope that you'll eventually share the QSS with the rest of us :-)
xnview wrote:Which padding?
I think arabtornado is referring to the spacing between the browser toolbar and the thumbnail panel.
Perhaps there's a way to align the address/navigation field, the buttons and the slider for changing the thumbnail size a vertically centered?

Forum references:
arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Re: Xnview MP Dark UI Enhancement

Post by arabtornado »

Actually what i meant by padding is the vertical alignment of the icons in the address/search toolbar

Here is an update, I Fixed some problems in the original post.

Image Image

and here is the style files
http://www.mediafire.com/?qhzewsxbq2z5wz5

feel free to improve it, and if you want to help me on improving it then i will be glad ;)

Thank you XnTriq and Xnview for your help :D
User avatar
XnTriq
Moderator & Librarian
Posts: 6336
Joined: Sun Sep 25, 2005 3:00 am
Location: Ref Desk

Re: Xnview MP Dark UI Enhancement

Post by XnTriq »

arabtornado wrote:and here is the style files
http://www.mediafire.com/?qhzewsxbq2z5wz5
Thank you :D

Unfortunately I haven't found a way to address a specific toolbar button in order to change it's icon :?

Code: Select all

QToolButton {
border: 2px solid red;
border-radius: 5px;
image: url(UI:test.png);
}
arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Re: Xnview MP Dark UI Enhancement

Post by arabtornado »

You are welcome XnTriq ;)
Do anyone see that this UI still need enhancement from any kind, your opinion helps to make this UI looks much better :)
User avatar
xnview
Author of XnView
Posts: 43326
Joined: Mon Oct 13, 2003 7:31 am
Location: France
Contact:

Re: Xnview MP Dark UI Enhancement

Post by xnview »

I like your changes :)
arabtornado wrote:Actually what i meant by padding is the vertical alignment of the icons in the address/search toolbar
Sorry but where?
Pierre.
arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Re: Xnview MP Dark UI Enhancement

Post by arabtornado »

xnview wrote:I like your changes :)
arabtornado wrote:Actually what i meant by padding is the vertical alignment of the icons in the address/search toolbar
Sorry but where?
it was a problem i posted it's photo on the first post but i solved it and updated the snapshot on the next post, actually i meant that the icons wasn't centered correctly in the address/search toolbar
arabtornado
Posts: 13
Joined: Thu Jun 14, 2012 8:50 am

Re: Xnview MP Dark UI Enhancement

Post by arabtornado »

How can i change close tabs icons (the X mark on every tab) and also how to change the icons of the toolbar
User avatar
XnTriq
Moderator & Librarian
Posts: 6336
Joined: Sun Sep 25, 2005 3:00 am
Location: Ref Desk

Re: Xnview MP Dark UI Enhancement

Post by XnTriq »

arabtornado wrote:How can i change close tabs icons (the X mark on every tab)

Code: Select all

QTabBar::close-button {
image: url(UI:close-button.png);
subcontrol-position: left;
}

QTabBar::close-button:hover {
image: url(UI:close-button_hover.png);
}
User avatar
xnview
Author of XnView
Posts: 43326
Joined: Mon Oct 13, 2003 7:31 am
Location: France
Contact:

Re: Xnview MP Dark UI Enhancement

Post by xnview »

arabtornado wrote:how to change the icons of the toolbar
Currently it's not possible, but please send me some icons, and i'll add a settings..
Pierre.
User avatar
XnTriq
Moderator & Librarian
Posts: 6336
Joined: Sun Sep 25, 2005 3:00 am
Location: Ref Desk

Re: Xnview MP Dark UI Enhancement

Post by XnTriq »

xnview wrote:Currently it's not possible, but please send me some icons, and i'll add a settings..
Is this going to be a skinning feature as in XnView Classic, Pierre?
Post Reply