Asign  custom skin for mx.containers.panel in Flex 3

Posted on 2011-10-11
Last Modified: 2012-05-12
Asign  custom skin for mx.containers.panel in Flex 3
Question by:hokyux
    LVL 29

    Expert Comment

    It's very simple.
    You can create your custom class and override from HalloBorder or Panel skin class

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="" layout="vertical">
    			import mx.skins.halo.HaloBorder;
    			import mx.skins.halo.PanelSkin;
    	<mx:Panel width="100%" height="50%" borderSkin="{HaloBorder}"/>
    	<mx:Panel width="100%" height="50%" borderSkin="{PanelSkin}"/>

    Open in new window


    Author Comment

    Sorry Sage, but I dont know nothing about Flex 3,

    I would know it doit by Flex 4,
    create a custom skin in mxml with hostcomponent to  spark.panel
    and finally asigna  this custom skin to my  panel.skinclass

    but for flex 3,
    I need the entire example for asign custom skin to my  mx.container.panel(  flex 3)
    the reason is because I am using FlexLib  for my project
    in order to implement MDI ( sub windows into my main frame container)
    beside I am using spark component for my App, MDI container uses flex 3 panels.

    or the other good question is how to build MDI applications for Flex 4 with out FlexLib,
    because its MDIWindow is very uggly. made in flex 3

    LVL 29

    Accepted Solution

    I don't know how do you want to styling border skin for your Panel component, but here is example how can I override default background of PanelSkin if you will change in my skin class variable
    var overrideAll:Boolean = false; to true. My code will create an yellow background
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="" layout="vertical">
    	<mx:Panel width="100%" height="50%" borderSkin="{CustomPanelSkin}"/>

    Open in new window

    	import flash.display.Graphics;
    	import mx.core.mx_internal;
    	import mx.skins.halo.PanelSkin;
    	use namespace mx_internal;
    	public class CustomPanelSkin extends PanelSkin
    		public function CustomPanelSkin(){
    		override mx_internal function drawBackground(w:Number, h:Number):void
    			super.drawBackground(w, h);
    			var overrideAll:Boolean = false;
    				var g:Graphics = graphics;
    				g.beginFill(0xffff00, 1);
    				g.drawRect(x, y, w, h);

    Open in new window


    Author Closing Comment

    HAve to read a lot

    Featured Post

    How to run any project with ease

    Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
    - Combine task lists, docs, spreadsheets, and chat in one
    - View and edit from mobile/offline
    - Cut down on emails

    Join & Write a Comment

    First things first - Preparation We need all the part for this install and it's much nicer to have them all on hand when you need them so here's what's required. Download Eclipse 3.5 32 bit (I like the Classic flavour) from here. (http://www.e…
    Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
    Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…
    In this tutorial you'll learn about bandwidth monitoring with flows and packet sniffing with our network monitoring solution PRTG Network Monitor ( If you're interested in additional methods for monitoring bandwidt…

    755 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    23 Experts available now in Live!

    Get 1:1 Help Now