customize the loading screen of flex viewer

[SaurabhGupta5]

Hello,

i am trying to put customize logo instead of default loading for esri viewer for flex, any help would be greatly appreciated. thanks

PFB the default loading screen i want to replace with some logo.

Reagrds

Saurabh

[RobertScheitlin__GISP]

Saurabh,

    This is the link that I used to learn how to do this.

Building a custom Flex preloader | Adobe Developer Connection

[SaurabhGupta5]

Thanks for quick reply robert. i will check on to this one and will confirm back to you soon. Thanks

[SaurabhGupta5]

Hi Robert,

Quick help, where should i add this page in my esri flex viewer 3.6 , where to call from ?

Thanks

[RobertScheitlin__GISP · Accepted solution]

Saurabh,

   In the Index.mxml of your project.

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

               xmlns:s="library://ns.adobe.com/flex/spark"

               xmlns:viewer="com.esri.viewer.*"

               xmlns:managers="com.esri.viewer.managers.*"

               pageTitle="Parcel Viewer Flex Version"

               preloader="com.calhoun.county.CalPreloader">

[SaurabhGupta5]

Wow, i got it correct from your help but only one concern how to use customized image instead of displayloader(swc). i want to use image . please suggest . Thanks

[RobertScheitlin__GISP]

Saurabh,

I don't know the answer that question.

Glad to help. Now it is your turn to help the community by marking this question as answered. All you have to do is click the "Correct Answer" link (the one with the little green star) on the post that provided the answer for you. If the answer was not provided by one of the responders then you can mark any of the replies that you received as helpful by clicking on the "Actions" menu and choosing "Mark as Helpful"

[SaurabhGupta5]

Done robert,

but please let me know if you get some clue on how to load image instead of flash content. that will be helpfull. thanls

[SaurabhGupta5]

HERE IS THE SOLUTION..

// ActionScript file

package com.esri.viewer
{
import flash.display.DisplayObject;
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.Event;
import flash.events.ProgressEvent;
import flash.text.TextField;
import flash.text.TextFormat;

import flashx.textLayout.tlf_internal;

import mx.core.mx_internal;
import mx.preloaders.SparkDownloadProgressBar;

import org.as3commons.lang.Assert;

use namespace mx_internal;

public class Preloader extends SparkDownloadProgressBar {
 
  [Embed(source="assets/images/loaderlogo.png")] public var logoClass:Class;
 
  private var preloaderLogo : MovieClip;
  private var loadingText : TextField;
  private var loadingProgress : TextField;
 
  private var _initProgressCount : uint = 0;
 
  private var textFormat : TextFormat = new TextFormat("Verdana", 16, 0x666666, true);
 
  public function Preloader() {
   super();
  
   textFormat.align = "center";
  }
 
 
  override public function set preloader(value : Sprite) : void {
   super.preloader = value;
  
   if (!preloaderLogo) {
   
    var img:DisplayObject = new logoClass();
   
    preloaderLogo = new MovieClip();  // kakaranet logo
    preloaderLogo.addChild(img);
   
    var startX : Number = Math.round((stageWidth - preloaderLogo.width) / 2);
    var startY : Number = Math.round((stageHeight - preloaderLogo.height) / 2);
   
    preloaderLogo.x = startX;
    preloaderLogo.y = startY;
   
    loadingText = new TextField();
    loadingProgress = new TextField();
   
    loadingText.width = stageWidth;//to allow center align
    loadingProgress.width = stageWidth;               
   
   
    loadingText.text = "Loading...";
    loadingText.y = preloaderLogo.y + preloaderLogo.height + 20;
   
   
    loadingProgress.text = "0%";
    loadingProgress.y = loadingText.y + loadingText.textHeight + 10;
   
    addChild(preloaderLogo);
    addChild(loadingText);
    addChild(loadingProgress);
   
    loadingText.setTextFormat(textFormat);
    loadingProgress.setTextFormat(textFormat);
   }
  }
 
 
  override protected function progressHandler(event : ProgressEvent) : void {
   super.progressHandler(event);
   if (loadingProgress) {
    loadingProgress.text = Math.floor(event.bytesLoaded / event.bytesTotal * 100) + "%";
    loadingProgress.setTextFormat(textFormat);
   }
  
  }
 
  override protected function completeHandler(event : Event) : void {
   loadingText.text = "Ready!";
   loadingText.setTextFormat(textFormat);
   preloaderLogo.stop();
  }       
 
 
  override protected function initProgressHandler(event : Event) : void {
   super.initProgressHandler(event);
   //similar to super
   _initProgressCount++;
   if (loadingProgress) {
    loadingProgress.text = "100% / " + Math.floor(_initProgressCount / initProgressTotal * 100) + "%";
    loadingProgress.setTextFormat(textFormat);
   }
  }
 
 
 
}
}