Select to view content in your preferred language

Editing Banner in Sample Flex Viewer

3355
17
06-16-2010 09:10 AM
SandeepTalasila
Occasional Contributor
I want to edit the banner of the sample flex viewer, I would like to show the sub title in two lines, instead of one line. Because the width of the banner is increasing if my subtitle is too long. I have tried line breaks used in XML but it didn't work. I also tried adding two subtitles, but still I cannot get to the result. Please let me know any ideas.

Thanks,
Sandeep.
Tags (2)
0 Kudos
17 Replies
RobertScheitlin__GISP
MVP Emeritus
Darryl,

   You have to set the width of both the banner.mxml and the controller.mxml

1. in the index.mxml change the existing line to this one
<controller><Controller id="control" left="20" top="20" right="30" width="100%"/></controller>


2. in the Banner.mxml add
width  ="100%"

to the top canvas.
0 Kudos
IanParfitt
Deactivated User
Hi
I'm trying to use parameters from the URL to populate the subtitle string.   I have a getURLParameters function which I use in MapManager.mxml (see below) but don't know how to call this in Banner.mxml to redefine the subtitle string.   I guess I need to add this function to Banner.mxml and write another function that calls it?  Any help would be much appreciated

Thanks

Ian





            private function getURLParameters():Object
            {
                var result:URLVariables = new URLVariables();

                try
                {
                    if (ExternalInterface.available)
                    {
                        // See http://livedocs.adobe.com/flex/3/langref/flash/external/ExternalInterface.html
                        var search:String = ExternalInterface.call("location.search.substring", 1);
                        if (search && search.length > 0)
                        {
                            result.decode(search);
                        }
                    }
                }
                catch (error:Error)
                {
                    Alert.show(error.toString());
                }

                return result;
            } 
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Ian,

   You can actually do it all in the MapManager.mxml in the mapLoadComplete function.

I have setup the url parameter as "sTitle" so it would look like (http://gislap134/flexviewer/index.html?sTitle=hi%20world).

private function mapLoadComplete(event:MapEvent):void
      {
       SiteContainer.dispatchEvent(new AppEvent(AppEvent.LAYER_LOADED, false, false, null));
       
                try
                {
                    if (ExternalInterface.available)
                    {
                     var result:URLVariables = new URLVariables();
                        // See http://livedocs.adobe.com/flex/3/langref/flash/external/ExternalInterface.html
                        var search:String = ExternalInterface.call("location.search.substring", 1);
                        if (search && search.length > 0 && search != "debug=true")
                        {
                         result.decode(search);
                         var xUrlParam:String;
                         if (result["sTitle"]){
        xUrlParam = result.sTitle; 
                             SiteContainer.getInstance().controller.banner.subtitle = xUrlParam;
                          } 
                        }
                    }
                }
                catch (error:Error){}
            }
0 Kudos
IanParfitt
Deactivated User
Thanks Robert, that is just what I needed - changed your param variable to mine and it worked first try!    Sending you a virtual cerveza, have a great weekend.

Ian
0 Kudos
TristanKnowlton
Frequent Contributor
Thanks Robert for the tip change the banner width to 100% of page.

Greatly appreciated!!
0 Kudos
JustinFultz
Regular Contributor
I have been unsuccessful at changing the subtitle color in the default.css file.

I have tried the following:

color: #FF0000;
color: 0#FF0000;
color: red;
fontColor: #FF0000;
fontColor: 0#FF0000;
fontColor: red;

Anyone have any other suggestions?
0 Kudos
KeithBornhorst
Deactivated User
Your default.css additions...

.BannerSubtitle
{
 color:#ff0000;
}


... are being overriden by code in UIManager that sets the subtitle color to the title color.

// UIManager.as ~line 203
var cssStyleDeclarationBannerSubtitle:CSSStyleDeclaration = new CSSStyleDeclaration(".BannerSubtitle");
if (numberOfStyleColors > 4)
{
     cssStyleDeclarationBannerSubtitle.setStyle("color", titleColor);
}
topLevelStyleManager.setStyleDeclaration(".BannerSubtitle", cssStyleDeclarationBannerSubtitle, false);


Comment that out and your subtitle should take whatever stylings are assigned to it in default.css.

Cheers,
K
0 Kudos
JustinFultz
Regular Contributor
Perfect! Thanks!
0 Kudos