Rename TooltipButton -> ToggleButton and add an active state. Use for production group icons.

OpenRA.Game/Widgets/ButtonWidget.cs

@@ -128,7 +128,7 @@ namespace OpenRA.Widgets
 			var s = font.Measure(text);
 			var stateOffset = (Depressed) ? new int2(VisualHeight, VisualHeight) : new int2(0, 0);
 			
-			DrawBackground("button", rb, disabled, Depressed, Widget.MouseOverWidget == this);
+			DrawBackground(rb, disabled, Depressed, Widget.MouseOverWidget == this);
 			font.DrawText(text, new int2(rb.X + (UsableWidth - s.X)/ 2, rb.Y + (Bounds.Height - s.Y) / 2) + stateOffset,
 			              disabled ? Color.Gray : Color.White);
 		}
@@ -136,6 +136,11 @@ namespace OpenRA.Widgets
 		public override Widget Clone() { return new ButtonWidget(this); }
 		public virtual int UsableWidth { get { return Bounds.Width; } }
 
+		public virtual void DrawBackground(Rectangle rect, bool disabled, bool pressed, bool hover)
+		{
+			ButtonWidget.DrawBackground("button", rect, disabled, pressed, hover);
+		}
+
 		public static void DrawBackground(string baseName, Rectangle rect, bool disabled, bool pressed, bool hover)
 		{
 			var state = disabled ? "-disabled" : 

OpenRA.Mods.Cnc/OpenRA.Mods.Cnc.csproj

@@ -98,12 +98,12 @@
     <Compile Include="Widgets\SupportPowersWidget.cs" />
     <Compile Include="Widgets\Logic\ProductionTooltipLogic.cs" />
     <Compile Include="Widgets\TooltipContainerWidget.cs" />
-    <Compile Include="Widgets\TooltipButtonWidget.cs" />
     <Compile Include="Widgets\Logic\ButtonTooltipLogic.cs" />
     <Compile Include="Widgets\Logic\SimpleTooltipLogic.cs" />
     <Compile Include="Widgets\Logic\WorldTooltipLogic.cs" />
     <Compile Include="Widgets\CncWorldInteractionControllerWidget.cs" />
     <Compile Include="Widgets\Logic\SupportPowerTooltipLogic.cs" />
+    <Compile Include="Widgets\ToggleButtonWidget.cs" />
   </ItemGroup>
   <ItemGroup>
     <ProjectReference Include="..\OpenRA.FileFormats\OpenRA.FileFormats.csproj">

OpenRA.Mods.Cnc/Widgets/Logic/ButtonTooltipLogic.cs

@@ -17,7 +17,7 @@ namespace OpenRA.Mods.Cnc.Widgets.Logic
 	{
 		[ObjectCreator.UseCtor]
 		public ButtonTooltipLogic([ObjectCreator.Param] Widget widget,
-		                         [ObjectCreator.Param] TooltipButtonWidget button)
+		                         [ObjectCreator.Param] ToggleButtonWidget button)
 		{
 			var label = widget.GetWidget<LabelWidget>("LABEL");
 			var hotkey = widget.GetWidget<LabelWidget>("HOTKEY");

OpenRA.Mods.Cnc/Widgets/Logic/CncIngameChromeLogic.cs

@@ -44,7 +44,7 @@ namespace OpenRA.Mods.Cnc.Widgets.Logic
 			}
 		}
 		
-		void SetupProductionGroupButton(ButtonWidget button, string group)
+		void SetupProductionGroupButton(ToggleButtonWidget button, string group)
 		{
 			Action<bool> selectTab = reverse =>
 			{
@@ -57,7 +57,7 @@ namespace OpenRA.Mods.Cnc.Widgets.Logic
 			button.IsDisabled = () => queueTabs.Groups[group].Tabs.Count == 0;
 			button.OnMouseUp = mi => selectTab(mi.Modifiers.HasModifier(Modifiers.Shift));
 			button.OnKeyPress = e => selectTab(e.Modifiers.HasModifier(Modifiers.Shift));
-
+			button.IsToggled = () => queueTabs.QueueGroup == group;
 			var chromeName = group.ToLowerInvariant();
 			var icon = button.GetWidget<ImageWidget>("ICON");
 			icon.GetImageName = () => button.IsDisabled() ? chromeName+"-disabled" :
@@ -128,11 +128,11 @@ namespace OpenRA.Mods.Cnc.Widgets.Logic
 				world.ActorRemoved += queueTabs.ActorChanged;
 
 				var queueTypes = sidebarRoot.GetWidget("PRODUCTION_TYPES");
-				SetupProductionGroupButton(queueTypes.GetWidget<ButtonWidget>("BUILDING"), "Building");
+				SetupProductionGroupButton(queueTypes.GetWidget<ToggleButtonWidget>("BUILDING"), "Building");
-				SetupProductionGroupButton(queueTypes.GetWidget<ButtonWidget>("DEFENSE"), "Defense");
+				SetupProductionGroupButton(queueTypes.GetWidget<ToggleButtonWidget>("DEFENSE"), "Defense");
-				SetupProductionGroupButton(queueTypes.GetWidget<ButtonWidget>("INFANTRY"), "Infantry");
+				SetupProductionGroupButton(queueTypes.GetWidget<ToggleButtonWidget>("INFANTRY"), "Infantry");
-				SetupProductionGroupButton(queueTypes.GetWidget<ButtonWidget>("VEHICLE"), "Vehicle");
+				SetupProductionGroupButton(queueTypes.GetWidget<ToggleButtonWidget>("VEHICLE"), "Vehicle");
-				SetupProductionGroupButton(queueTypes.GetWidget<ButtonWidget>("AIRCRAFT"), "Aircraft");
+				SetupProductionGroupButton(queueTypes.GetWidget<ToggleButtonWidget>("AIRCRAFT"), "Aircraft");
 
 				playerWidgets.GetWidget<ButtonWidget>("OPTIONS_BUTTON").OnClick = onOptionsClick;
 

OpenRA.Mods.Cnc/Widgets/ToggleButtonWidget.cs

@@ -8,26 +8,29 @@
  */
 #endregion
 
+using System;
+using System.Drawing;
 using OpenRA.FileFormats;
 using OpenRA.Widgets;
 
 namespace OpenRA.Mods.Cnc.Widgets
 {
-	public class TooltipButtonWidget : ButtonWidget
+	public class ToggleButtonWidget : ButtonWidget
 	{
 		public readonly string TooltipTemplate = "BUTTON_TOOLTIP";
 		public readonly string TooltipText;
 		public readonly string TooltipContainer;
+		public Func<bool> IsToggled = () => false;
 		Lazy<TooltipContainerWidget> tooltipContainer;
 
-		public TooltipButtonWidget()
+		public ToggleButtonWidget()
 			: base()
 		{
 			tooltipContainer = new Lazy<TooltipContainerWidget>(() =>
 				Widget.RootWidget.GetWidget<TooltipContainerWidget>(TooltipContainer));
 		}
 
-		protected TooltipButtonWidget(TooltipButtonWidget other)
+		protected ToggleButtonWidget(ToggleButtonWidget other)
 			: base(other)
 		{
 			TooltipTemplate = other.TooltipTemplate;
@@ -48,5 +51,11 @@ namespace OpenRA.Mods.Cnc.Widgets
 			if (TooltipContainer == null) return;
 			tooltipContainer.Value.RemoveTooltip();
 		}
+
+		public override void DrawBackground(Rectangle rect, bool disabled, bool pressed, bool hover)
+		{
+			var baseName = IsToggled() ? "button-toggled" : "button";
+			ButtonWidget.DrawBackground(baseName, rect, disabled, pressed, hover);
+		}
 	}
 }

artsrc/cnc/chrome.svg

@@ -61,9 +61,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="4"
+     inkscape:zoom="2"
-     inkscape:cx="289.47924"
+     inkscape:cx="159.47924"
-     inkscape:cy="458.66173"
+     inkscape:cy="358.66173"
      inkscape:document-units="px"
      inkscape:current-layer="layer1"
      showgrid="false"
@@ -1234,5 +1234,45 @@
        id="path3178"
        inkscape:connector-curvature="0"
        sodipodi:nodetypes="ccccc" />
+    <rect
+       style="fill:#800000;fill-opacity:0.87843138;stroke:#800000;stroke-width:1;stroke-linecap:square;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
+       id="rect3962"
+       width="31"
+       height="31"
+       x="256.5"
+       y="668.86218"
+       inkscape:export-filename="/Users/paul/src/OpenRA/mods/cnc/uibits/rect3776.png"
+       inkscape:export-xdpi="90"
+       inkscape:export-ydpi="90" />
+    <rect
+       inkscape:export-ydpi="90"
+       inkscape:export-xdpi="90"
+       inkscape:export-filename="/Users/paul/src/OpenRA/mods/cnc/uibits/rect3776.png"
+       y="668.86218"
+       x="288.5"
+       height="31"
+       width="31"
+       id="rect3964"
+       style="fill:#b00000;fill-opacity:0.87843138;stroke:#c00000;stroke-width:1;stroke-linecap:square;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
+    <rect
+       inkscape:export-ydpi="90"
+       inkscape:export-xdpi="90"
+       inkscape:export-filename="/Users/paul/src/OpenRA/mods/cnc/uibits/rect3776.png"
+       y="700.86218"
+       x="256.5"
+       height="31"
+       width="31"
+       id="rect3966"
+       style="fill:#5c0000;fill-opacity:0.87843138;stroke:#800000;stroke-width:1;stroke-linecap:square;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
+    <rect
+       style="fill:#502b2b;fill-opacity:0.87843138;stroke:#800000;stroke-width:1;stroke-linecap:square;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
+       id="rect3968"
+       width="31"
+       height="31"
+       x="288.5"
+       y="700.86218"
+       inkscape:export-filename="/Users/paul/src/OpenRA/mods/cnc/uibits/rect3776.png"
+       inkscape:export-xdpi="90"
+       inkscape:export-ydpi="90" />
   </g>
 </svg>

mods/cnc/chrome.yaml

@@ -54,6 +54,50 @@ button-pressed: chrome.png
 	corner-bl: 64,254,2,2
 	corner-br: 126,254,2,2
 
+button-toggled: chrome.png
+	background: 257,129,30,30
+	border-r: 287,129,1,30
+	border-l: 256,129,1,30
+	border-b: 257,159,30,1
+	border-t: 257,128,30,1
+	corner-tl: 256,128,1,1
+	corner-tr: 287,128,1,1
+	corner-bl: 256,159,1,1
+	corner-br: 287,159,1,1
+
+button-toggled-hover: chrome.png
+	background: 289,129,30,30
+	border-r: 319,129,1,30
+	border-l: 288,129,1,30
+	border-b: 289,159,30,1
+	border-t: 289,128,30,1
+	corner-tl: 288,128,1,1
+	corner-tr: 319,128,1,1
+	corner-bl: 288,159,1,1
+	corner-br: 319,159,1,1
+
+button-toggled-pressed: chrome.png
+	background: 257,161,30,30
+	border-r: 287,161,1,30
+	border-l: 256,161,1,30
+	border-b: 257,191,30,1
+	border-t: 257,160,30,1
+	corner-tl: 256,160,1,1
+	corner-tr: 287,160,1,1
+	corner-bl: 256,191,1,1
+	corner-br: 287,191,1,1
+
+button-toggled-disabled: chrome.png
+	background: 289,161,30,30
+	border-r: 319,161,1,30
+	border-l: 288,161,1,30
+	border-b: 289,191,30,1
+	border-t: 289,160,30,1
+	corner-tl: 288,160,1,1
+	corner-tr: 319,160,1,1
+	corner-bl: 288,191,1,1
+	corner-br: 319,191,1,1
+
 scrollthumb: chrome.png
 	background: 2,194,60,60
 	border-r: 62,194,2,60

mods/cnc/chrome/ingame.yaml

@@ -56,7 +56,7 @@ Container@INGAME_ROOT:
 Container@OBSERVER_WIDGETS:
 	Id:OBSERVER_WIDGETS
 	Children:
-		TooltipButton@OPTIONS_BUTTON:
+		ToggleButton@OPTIONS_BUTTON:
 			Id:OPTIONS_BUTTON
 			Key:escape
 			X:WINDOW_RIGHT-202
@@ -127,7 +127,7 @@ Container@PLAYER_WIDGETS:
 			Height:240
 			Background:panel-black
 			Children:
-				TooltipButton@OPTIONS_BUTTON:
+				ToggleButton@OPTIONS_BUTTON:
 					Id:OPTIONS_BUTTON
 					Key:escape
 					X:42
@@ -146,7 +146,7 @@ Container@PLAYER_WIDGETS:
 							Y:5
 							ImageCollection:order-icons
 							ImageName:options
-				TooltipButton@SELL_BUTTON:
+				ToggleButton@SELL_BUTTON:
 					Id:SELL_BUTTON
 					Key: [
 					X:82
@@ -164,7 +164,7 @@ Container@PLAYER_WIDGETS:
 							X:7
 							Y:5
 							ImageCollection:order-icons
-				TooltipButton@REPAIR_BUTTON:
+				ToggleButton@REPAIR_BUTTON:
 					Id:REPAIR_BUTTON
 					Key: ]
 					X:122
@@ -246,7 +246,7 @@ Container@PLAYER_WIDGETS:
 					Width:170
 					Height:30
 					Children:
-						TooltipButton@BUILDING:
+						ToggleButton@BUILDING:
 							Id:BUILDING
 							Width:30
 							Height:30
@@ -261,7 +261,7 @@ Container@PLAYER_WIDGETS:
 									X:7
 									Y:7
 									ImageCollection:production-icons
-						TooltipButton@DEFENSE:
+						ToggleButton@DEFENSE:
 							Id:DEFENSE
 							X:35
 							Width:30
@@ -277,7 +277,7 @@ Container@PLAYER_WIDGETS:
 									X:7
 									Y:7
 									ImageCollection:production-icons
-						TooltipButton@INFANTRY:
+						ToggleButton@INFANTRY:
 							Id:INFANTRY
 							X:70
 							Width:30
@@ -293,7 +293,7 @@ Container@PLAYER_WIDGETS:
 									X:7
 									Y:7
 									ImageCollection:production-icons
-						TooltipButton@VEHICLE:
+						ToggleButton@VEHICLE:
 							Id:VEHICLE
 							X:105
 							Width:30
@@ -309,7 +309,7 @@ Container@PLAYER_WIDGETS:
 									X:7
 									Y:7
 									ImageCollection:production-icons
-						TooltipButton@AIRCRAFT:
+						ToggleButton@AIRCRAFT:
 							Id:AIRCRAFT
 							X:140
 							Width:30