1//////////////////////////////////////////////////////////////////////////////// 2// 3// ADOBE SYSTEMS INCORPORATED 4// Copyright 2003-2006 Adobe Systems Incorporated 5// All Rights Reserved. 6// 7// NOTICE: Adobe permits you to use, modify, and distribute this file 8// in accordance with the terms of the license agreement accompanying it. 9// 10//////////////////////////////////////////////////////////////////////////////// 11 12package haloclassic 13{ 14 15import mx.core.EdgeMetrics; 16import mx.skins.Border; 17import mx.styles.StyleManager; 18import mx.utils.ColorUtil; 19 20/** 21 * The skin for all the states of a Tab in a TabNavigator or TabBar. 22 */ 23public class TabSkin extends Border 24{ 25 include "../mx/core/Version.as"; 26 27 //-------------------------------------------------------------------------- 28 // 29 // Class variables 30 // 31 //-------------------------------------------------------------------------- 32 33 /** 34 * @private 35 */ 36 private static var cache:Object = {}; 37 38 //-------------------------------------------------------------------------- 39 // 40 // Class methods 41 // 42 //-------------------------------------------------------------------------- 43 44 /** 45 * @private 46 * Several colors used for drawing are calculated from the base colors 47 * of the component (themeColor, borderColor and fillColors). 48 * Since these calculations can be a bit expensive, 49 * we calculate once per color set and cache the results. 50 */ 51 private static function calcDerivedStyles(themeColor:uint, 52 borderColor:uint, 53 falseFillColor0:uint, 54 falseFillColor1:uint, 55 fillColor0:uint, 56 fillColor1:uint):Object 57 { 58 var key:String = HaloColors.getCacheKey(themeColor, borderColor, 59 falseFillColor0, 60 falseFillColor1, 61 fillColor0, fillColor1); 62 63 if (!cache[key]) 64 { 65 var o:Object = cache[key] = {}; 66 67 // Cross-component styles. 68 HaloColors.addHaloColors(o, themeColor, fillColor0, fillColor1); 69 70 // Tab-specific styles. 71 o.borderColorDrk1 = 72 ColorUtil.adjustBrightness2(borderColor, -30); 73 o.falseBevelHighlight = 74 ColorUtil.adjustBrightness2(falseFillColor0, 60); 75 o.falseFillColorBright1 = 76 ColorUtil.adjustBrightness(falseFillColor0, 15); 77 o.falseFillColorBright2 = 78 ColorUtil.adjustBrightness(falseFillColor1, 15); 79 } 80 81 return cache[key]; 82 } 83 84 //-------------------------------------------------------------------------- 85 // 86 // Constructor 87 // 88 //-------------------------------------------------------------------------- 89 90 /** 91 * Constructor. 92 */ 93 public function TabSkin() 94 { 95 super(); 96 } 97 98 //-------------------------------------------------------------------------- 99 // 100 // Overridden properties 101 // 102 //-------------------------------------------------------------------------- 103 104 //---------------------------------- 105 // borderMetrics 106 //---------------------------------- 107 108 /** 109 * @private 110 * Storage for the borderMetrics property. 111 */ 112 private var _borderMetrics:EdgeMetrics = new EdgeMetrics(1, 1, 1, 1); 113 114 /** 115 * @private 116 * Internal object that contains the thickness of each edge 117 * of the border 118 */ 119 override public function get borderMetrics():EdgeMetrics 120 { 121 return _borderMetrics; 122 } 123 124 //---------------------------------- 125 // measuredWidth 126 //---------------------------------- 127 128 /** 129 * @private 130 */ 131 override public function get measuredWidth():Number 132 { 133 return 50; 134 } 135 136 //---------------------------------- 137 // measuredHeight 138 //---------------------------------- 139 140 /** 141 * @private 142 */ 143 override public function get measuredHeight():Number 144 { 145 return 22; 146 } 147 148 //-------------------------------------------------------------------------- 149 // 150 // Overridden methods 151 // 152 //-------------------------------------------------------------------------- 153 154 /** 155 * @private 156 */ 157 override protected function updateDisplayList(w:Number, h:Number):void 158 { 159 super.updateDisplayList(w, h); 160 161 // User-defined styles. 162 var bevel:Boolean = getStyle("bevel"); 163 var borderColor:uint = getStyle("borderColor"); 164 var cornerRadius:Number = getStyle("cornerRadius"); 165 var fillColors:Array /* of Number */ = getStyle("fillColors"); 166 StyleManager.getColorNames(fillColors); 167 var themeColor:uint = getStyle("themeColor"); 168 169 // Placehold styles stub 170 // themeColor = 0x80FF4D; // new halo green color 171 var falseFillColors:Array = []; /* of Number*/ // added style prop 172 falseFillColors[0] = fillColors[0]; // 0xE6EEEE; // default halo fill color for false tab 173 falseFillColors[1] = fillColors[1]; // 0xFFFFFF; 174 175 fillColors = getStyle("selectedFillColors"); 176 if (!fillColors) 177 { 178 fillColors = []; // So we don't clobber the original... 179 fillColors[0] = ColorUtil.adjustBrightness2(themeColor, 65); // default style for halo 180 fillColors[1] = 0xFFFFFF; // default tab navigator background 181 } 182 183 // Derivative styles. 184 var derStyles:Object = calcDerivedStyles(themeColor, borderColor, 185 falseFillColors[0], 186 falseFillColors[1], 187 fillColors[0], fillColors[1]); 188 189 var cornerRadius2:Number = Math.max(cornerRadius - 2, 0); 190 191 graphics.clear(); 192 193 switch (name) 194 { 195 case "upSkin": 196 { 197 if (bevel) 198 { 199 // outer edge 200 drawRoundRect( 201 0, 0, w, h - 1, 202 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 203 [ derStyles.borderColorDrk1, borderColor ], 1, 204 verticalGradientMatrix(0, 0, w, h)); 205 206 // highlight edge 207 drawRoundRect( 208 1, 1, w - 2, h - 2, 209 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 210 derStyles.falseBevelHighlight, 1); 211 212 // tab fill 213 drawRoundRect( 214 1, 2, w - 2, h - 3, 215 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 216 [ falseFillColors[0], falseFillColors[1] ], 1, 217 verticalGradientMatrix(0, 2, w - 2, h - 3)); 218 } 219 else 220 { 221 // outer edge 222 drawRoundRect( 223 0, 0, w, h - 1, 224 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 225 borderColor, 1); 226 227 // tab fill 228 drawRoundRect( 229 1, 1, w - 2, h - 2, 230 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 231 [ falseFillColors[0], falseFillColors[1] ], 1, 232 verticalGradientMatrix(0, 2, w - 2, h - 6)); 233 } 234 235 // tab bottom line 236 drawRoundRect( 237 0, h - 1, w, 1, 0, 238 borderColor, 1); 239 240 // tab shadow 241 drawRoundRect( 242 0, h - 2, w, 1, 0, 243 0x000000, 0.10); 244 245 // tab shadow 246 drawRoundRect( 247 0, h - 3, w, 1, 0, 248 0x000000, 0.05); 249 250 break; 251 } 252 253 case "overSkin": 254 { 255 if (bevel) 256 { 257 // outer edge 258 drawRoundRect( 259 0, 0, w, h - 1, 260 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 261 [ derStyles.themeColDrk1, derStyles.themeColDrk2 ], 1, 262 verticalGradientMatrix(0, 0, w, h - 6)); 263 264 // highlight edge 265 drawRoundRect( 266 1, 1, w - 2, h - 2, 267 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 268 derStyles.falseBevelHighlight, 1); 269 270 // tab fill 271 drawRoundRect( 272 1, 2, w - 2, h - 3, 273 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 274 [ derStyles.falseFillColorBright1, 275 derStyles.falseFillColorBright2 ], 1, 276 verticalGradientMatrix(2, 2, w - 2, h - 2)); 277 } 278 else 279 { 280 // outer edge 281 drawRoundRect( 282 0, 0, w, h - 1, 283 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 284 derStyles.themeColDrk2, 1); 285 286 // tab fill 287 drawRoundRect( 288 1, 1, w - 2, h - 2, 289 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 290 [ derStyles.falseFillColorBright1, 291 derStyles.falseFillColorBright2 ], 1, 292 verticalGradientMatrix(2, 2, w - 2, h - 2)); 293 } 294 295 // tab bottom line 296 drawRoundRect( 297 0, h - 1, w, 1, 0, 298 borderColor, 1); 299 300 // tab shadow 301 drawRoundRect( 302 0, h - 2, w, 1, 0, 303 0x000000, 0.10); 304 305 // tab shadow 306 drawRoundRect( 307 0, h - 3, w, 1, 0, 308 0x000000, 0.05); 309 310 break; 311 } 312 313 case "disabledSkin": 314 { 315 if (bevel) 316 { 317 // outer edge 318 drawRoundRect( 319 0, 0, w, h - 1, 320 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 321 [ derStyles.borderColorDrk1, borderColor ], 1, 322 verticalGradientMatrix(0, 0, w, h - 6)); 323 324 // highlight edge 325 drawRoundRect( 326 1, 1, w - 2, h - 2, 327 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 328 fillColors[1], 1); 329 330 // tab fill 331 drawRoundRect( 332 1, 2, w - 2, h - 3, 333 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 334 [ fillColors[0], fillColors[1] ], 1, 335 verticalGradientMatrix(0, 2, w - 2, h - 2)); 336 } 337 else 338 { 339 // outer edge 340 drawRoundRect( 341 0, 0, w, h - 1, 342 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 343 borderColor, 1); 344 345 // tab fill 346 drawRoundRect( 347 1, 1, w - 2, h - 2, 348 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 349 [ fillColors[0], fillColors[1] ], 1, 350 verticalGradientMatrix(0, 2, w - 2, h - 2)); 351 } 352 353 // tab bottom line 354 drawRoundRect( 355 0, h - 1, w, 1, 0, 356 borderColor, 1); 357 358 // tab shadow 359 drawRoundRect( 360 0, h - 2, w, 1, 0, 361 0x000000, 0.10); 362 363 // tab shadow 364 drawRoundRect( 365 0, h - 3, w, 1, 0, 366 0x000000, 0.05); 367 368 break; 369 } 370 371 case "downSkin": 372 case "selectedUpSkin": 373 case "selectedDownSkin": 374 case "selectedOverSkin": 375 case "selectedDisabledSkin": 376 { 377 // outer edge back 378 drawRoundRect( 379 0, 0, w, h - 1, 380 { tl: cornerRadius, tr: cornerRadius, bl: 0, br: 0 }, 381 [ derStyles.borderColorDrk1, borderColor ], 1, 382 verticalGradientMatrix(0, 0, w, h - 2)); 383 384 if (bevel) 385 { 386 // highlight edge color 387 drawRoundRect( 388 1, 1, w - 2, h - 2, 389 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 390 derStyles.bevelHighlight1, 1); 391 392 // tab fill color 393 drawRoundRect( 394 1, 2, w - 2, h - 3, 395 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 396 [ fillColors[0], fillColors[1] ], 1, 397 verticalGradientMatrix(0, 2, w - 2, h / 2)); 398 } 399 else 400 { 401 // tab fill color 402 drawRoundRect( 403 1, 1, w - 2, h - 2, 404 { tl: cornerRadius2, tr: cornerRadius2, bl: 0, br: 0 }, 405 [ fillColors[0], fillColors[1] ], 1, 406 verticalGradientMatrix(0, 2, w - 2, h - 2)); 407 } 408 409 // tab bottom line 410 drawRoundRect( 411 1, h - 1, w - 2, 1, 0, 412 fillColors[1], 1); 413 414 break; 415 } 416 } 417 } 418} 419 420} 421