Ribbon Theme

User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Frances,

Glad to hear you got it working.

I now see that you were talking about the tab color and I was thinking the button hover color.
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Frances,
Still no class modification.
There is still at least one thing you cannot do without class modification. You cannot draw group separator bars without also drawing outlines. This is a show-stopper if you want an exact look like Office.

All that needs to be done is to provide a new color variables for separator bars which defaults to the same colors as "box" outlines. Then when you set the outlines to the same color as the ribbonbar (to make them disappear), then you can still set the color of the separator bars to whatever color you wish.

It would also be nice to have this new color as a passable parameter to the button's New() method.

However, I think a much better way to do this is by adding color variables to the ribbonbar class that will then automatically passed to every button by passing the oBar which is already happening.

James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
fraxzi
Posts: 811
Joined: Tue May 06, 2008 4:28 am
Location: Philippines
Contact:

Re: Ribbon Theme

Post by fraxzi »

Hi James,

You are correct. Eventually, we cannot avoid modifying the class.

:(
Kind Regards,
Frances

Fivewin for xHarbour v18.07
xHarbour v1.2.3.x
BCC 7.3 + PellesC8 ( Resource Compiler only)
ADS 10.1 / MariaDB
Crystal Reports 8.5/9.23 DE
xMate v1.15
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Now we have separator bars.

Image

I also adjusted the text to the right colors. Oh, and I did it without any class modifications.

I have to leave now but I will explain how to do the separator bars tommorow.

James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
fraxzi
Posts: 811
Joined: Tue May 06, 2008 4:28 am
Location: Philippines
Contact:

Re: Ribbon Theme

Post by fraxzi »

James Bott wrote:Now we have separator bars.

Image

I also adjusted the text to the right colors. Oh, and I did it without any class modifications.

I have to leave now but I will explain how to do the separator bars tommorow.

James

I'll be waiting Mr. James ...

:wink:
Kind Regards,
Frances

Fivewin for xHarbour v18.07
xHarbour v1.2.3.x
BCC 7.3 + PellesC8 ( Resource Compiler only)
ADS 10.1 / MariaDB
Crystal Reports 8.5/9.23 DE
xMate v1.15
User avatar
Silvio.Falconi
Posts: 4956
Joined: Thu Oct 18, 2012 7:17 pm

Re: Ribbon Theme

Post by Silvio.Falconi »

James Bott wrote:
Frances,
Still no class modification.
There is still at least one thing you cannot do without class modification. You cannot draw group separator bars without also drawing outlines. This is a show-stopper if you want an exact look like Office.

All that needs to be done is to provide a new color variables for separator bars which defaults to the same colors as "box" outlines. Then when you set the outlines to the same color as the ribbonbar (to make them disappear), then you can still set the color of the separator bars to whatever color you wish.

It would also be nice to have this new color as a passable parameter to the button's New() method.

However, I think a much better way to do this is by adding color variables to the ribbonbar class that will then automatically passed to every button by passing the oBar which is already happening.

James


But You could make an Override to RibbonBar(rbgroup,rbtn) Class
I use : FiveWin for Harbour August 2020 (Revision) - Harbour 3.2.0dev (r1712141320) - Bcc7.30 - xMate ver. 1.15.3 - PellesC
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Ok, here is how to get the separator bars without the outline boxes.

I found that the separator bars are actually drawn by the TBRGroup class. Groups are the sections of the ribbonbar. After you define the group, then you redefine the colors used to draw the separator bar. You can also redefine the color of the group title text the same way. You will have to do this for each group. I do have an idea that will make this much easier that I will be testing soon.

One other thing you need to do to get a ribbonbar style that looks like Office 2016 is to use the l2010 flag for the ribbon definition. Yes, it is ironic the the 2010 version looks most like the 2016 version.

Here is an example showing the Black Theme of Office 2019.

Code: Select all

   ADD GROUP oGr1 RIBBON oBar TO OPTION 1  WIDTH 120  PROMPT "Work Log" 

   // Controls the group title text color
   oGr1:nClrTxt := RGB( 224,224,224 ) // Black theme

   // These 2 control the separator bar colors 
   oGr1:nClrBoxOut:= RGB(102,102,102) // Black theme
   oGr1:nClrBoxIn:= RGB(102,102,102)  // Black theme
Later I will put together some full working samples of the different themes.

James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Silvio wrote:
But You could make an Override to RibbonBar(rbgroup,rbtn) Class
That is a possibility although I was never able to get that working. I usually just subclass, but the ribbonar code uses some code like this:

Code: Select all

 if oWnd:IsKindOf( "TRPANEL" ) .and. oRB != NIL
If you subclass you have to change the class name, thus subclassing might not work depending on what you are attempting.

Ideally, would be to have the classes modified to read in parameters from data files. Right now they are full of IF/THENs and DO/CASEs based on the style flags. However this is big task. I have spent a couple of weeks just trying to understand the code.

Then we also have the issue of themes. Office 2019 has 12 themes!

James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Frances,

Do you have any idea how to change the tab text color when hovering over it. The blue theme has white text on a dark blue background, then when you hover over it the tab background turns white and thus the text disappears. I need to change the text on the tab to a dark color when you hover the pointer over it.

Any ideas?

Thanks,
James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
cnavarro
Posts: 5792
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Ribbon Theme

Post by cnavarro »

James, try

Code: Select all

#define CLRTEXT             RGB(  21,  66, 139 )

.../...
   oRBar:nClrPaneRB := Rgb( 43, 87, 154 )
   nClrTabText   := CLR_WHITE
   For x = 1 to Len( oRBar:aClrTabTxt )
      oRBar:aClrTabTxt[ x ] := { | oSelf, nPrompt | ;
                       if( oSelf:l2013 .or. oSelf:l2015,;
                          if( nPrompt == oSelf:nOption, RGB( 255, 255, 255 ), ;
                              if( oSelf:l2015, nClrTabText, RGB( 100, 100, 100 ) ) ),;
                          if( oSelf:l2016, ;
                              if( nPrompt == oSelf:nOption, ;
                                  oRBar:nClrPaneRB, nClrTabText ), CLRTEXT ) ) }
   Next x

 
C. Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
Si alguien te dice que algo no se puede hacer, recuerda que esta hablando de sus limitaciones, no de las tuyas.
User avatar
fraxzi
Posts: 811
Joined: Tue May 06, 2008 4:28 am
Location: Philippines
Contact:

Re: Ribbon Theme

Post by fraxzi »

James Bott wrote:Frances,

Do you have any idea how to change the tab text color when hovering over it. The blue theme has white text on a dark blue background, then when you hover over it the tab background turns white and thus the text disappears. I need to change the text on the tab to a dark color when you hover the pointer over it.

Any ideas?

Thanks,
James

Hi James,

I did this:

Code: Select all


 :aGradOver  :=   { { 1, nRGB( 0, 114, 198 ), nRGB( 0, 114, 198 ) } }
 ...
  FOR i := 1 TO Len( :aPrompts )
        :aClrTabTxt[ i ] := {|oSelf, nPrompt| iif( nPrompt == oSelf:nOption, nRGB(0,0,0), nRGB( 255, 255, 255 ) )}
 NEXT
...
 
Kind Regards,
Frances

Fivewin for xHarbour v18.07
xHarbour v1.2.3.x
BCC 7.3 + PellesC8 ( Resource Compiler only)
ADS 10.1 / MariaDB
Crystal Reports 8.5/9.23 DE
xMate v1.15
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Cristobal and Frances,

OK guys, I apparently didn't make myself clear.

You both seem to have given me code to set the tab text color of unselected tabs. What I really need is to change the color of unselected tabs only when the cursor is hovering over it. Then when the cursor moves off, the color goes back to the unselected color. Below is a sample image. The capture doesn't include the cursor but it is over the second tab (Home) which you can barely read. I am hoping to be able change the text color to a darker color when the cursor is over the tab.

Image

Actually, I don't know exactly how MS Word 2016 does this. It just came to me, that perhaps they change the color of the hovered tab instead of the text. If either of you has access to a copy of MS Word 2016 maybe you can take a look and give me some feedback. I am trying to emulate Word as closely as possible.

Thanks,
James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
fraxzi
Posts: 811
Joined: Tue May 06, 2008 4:28 am
Location: Philippines
Contact:

Re: Ribbon Theme

Post by fraxzi »

Mr James,

This is ow my Standard MS Word ..
Image
Kind Regards,
Frances

Fivewin for xHarbour v18.07
xHarbour v1.2.3.x
BCC 7.3 + PellesC8 ( Resource Compiler only)
ADS 10.1 / MariaDB
Crystal Reports 8.5/9.23 DE
xMate v1.15
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

Frances,

Thanks for the video. I looked back at your code on the previous page where you showed how to get that effect with the tabs. I see that you used aGradOver. I have never been able to see any affect by either passing that array to the New() method or redefining it after the New() method.

I have had the same problem with the aGradNormal array--no effect I can see.

I am using FWH 18.05 and I see you are using 18.07. Maybe that is the issue. I think I am going to have to modify 18.05's TRibbonbar class method MouseHover() to see what is happening.
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
User avatar
James Bott
Posts: 4654
Joined: Fri Nov 18, 2005 4:52 pm
Location: San Diego, California, USA
Contact:

Re: Ribbon Theme

Post by James Bott »

OK, I just discovered that aGradOver is not working (it is ignored) with l2010, but it works fine with l2016.

All my work has been done with the l2010 flag since it makes groups the most similar to Office 2016.

So now I have to figure out where the bug is.

James
FWH 18.05/xHarbour 1.2.3/BCC7/Windows 10
Post Reply