33 коровы

AIR. Полезные советы. Часть 1.

October 3, 2011 – 8:07 pm

Всем привет.
В ходе последнего проекта накопилось некоторое количество интересностей, проблем и их решений. Я постараюсь рассказать о них в цикле статей.

Проблема 1: Генерим html строку, устанавливаем ее как HTML.htmlText, не отображаются картинки и swf-файлы.
Решение: Нужно разрешить добавлять контент из html строки в “песочницу” приложения

HTML.htmlLoader.placeLoadStringContentInApplicationSandbox = true;

Проблема 2: Есть HTML компонент. Нужно отделить контент, от скролла. Хочется чтобы скроллы были spark.
Решение:
HTML – это mx компонент. Гибкость работы со скроллами нам дают spark компоненты. Поэтому нужно преврать mx:HTML в компонент поддерживающий spark скроллы. Минимальным требованием является реализация spark.core.IViewport интерфейса. Приблизительный код компонента:

package com.the33cows.spark
{
	import flash.events.Event;
 
	import mx.controls.HTML;
 
	import spark.core.IViewport;
 
	public class SparkHTML extends HTML implements IViewport
	{
		public function SparkHTML()
		{
			super();
//прячем родные скроллы 
			verticalScrollPolicy = "off";
			horizontalScrollPolicy = "off";
			clipAndEnableScrolling = true;
		}
 
		private var _verticalScrollPosition:Number;
		private var _clipAndEnableScrolling:Boolean;
		private var _horizontalScrollPolicy:Number;
 
		[Bindable]
		public override function get contentHeight():Number
		{
			return super.contentHeight ;
		}
 
		[Bindable]
		public override function get contentWidth():Number
		{
			return super.contentWidth;
		}
 
		[Bindable]
		public override function get horizontalScrollPosition():Number
		{
			return super.horizontalScrollPosition;
		}
 
		public override function set horizontalScrollPosition(value:Number):void
		{
			_horizontalScrollPolicy = value;
 
			super.horizontalScrollPosition = value;
		}
 
		[Bindable]
		public override function get verticalScrollPosition():Number
		{
			return super.verticalScrollPosition;
		}
 
		public override function set verticalScrollPosition(value:Number):void
		{
			_verticalScrollPosition = value;
			super.verticalScrollPosition = value;
		}
 
 
		public function getHorizontalScrollPositionDelta(navigationUnit:uint):Number
		{
			return 0;
		}
 
		public function getVerticalScrollPositionDelta(navigationUnit:uint):Number
		{
			return 0;
		}
 
		[Bindable]
		public function get clipAndEnableScrolling():Boolean
		{
			return _clipAndEnableScrolling;
		}
 
		public function set clipAndEnableScrolling(value:Boolean):void
		{
			_clipAndEnableScrolling = value;
		}
 
		override protected function createChildren():void
		{
			super.createChildren();
			if (htmlLoader)
			{
//решаем проблему 1 на глобальном уровне. 
//Нужно быть внимательным если контент генерится "на стороне"
				htmlLoader.placeLoadStringContentInApplicationSandbox = true;
//слушаем изменение размеров внутренностей html
				htmlLoader.addEventListener(Event.HTML_BOUNDS_CHANGE, onHtmlBoundsChange, false, -100);
			}
		}
 
		private function onHtmlBoundsChange(event:Event):void
		{
			dispatchPropertyChangeEvent("contentHeight", contentHeight, contentHeight);
			dispatchPropertyChangeEvent("contentWidth", contentWidth, contentWidth);
		}
	}
}

использование

<s:HGroup>
<sprak:SparkHTML id="contentHtml" width="650" height="100%" />
<!-- отделили скролл -->
<s:HGroup  height="100%" width="100" gap="0" horizontalAlign="right" paddingRight="1" />
<!-- указали наш компонент как вью порт -->
<s:VScrollBar id="scrollPage" height="100%" viewport="{contentHtml}"/>
</s:HGroup>