среда, июня 27, 2007

List и дубликаты в датапровайдере

Давно заметил следующую теперь уже наверно фичу:
Сделаем маленький пример:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<mx:Script>
[Bindable]
public var listData:Array = ["alpha", "beta", "beta", "gamma", "delta"];
</mx:Script>
<mx:List dataProvider="{listData}"/>
</mx:Application>


В данном случае, если навести мышь на второй элемент, который идентичен третьему, то отработает наведение последний. Я думал, что это баг. Отнюдь. Вычитал из Jira, что List не должен иметь одинаковых элементов - все элементы коллекции должны иметь уникальный id, например,

public var listData:Array = [{label:"alpha", data: "01"}, {label:"beta", data: "04"}, {label:"beta", data: "90"}, {label: "gamma", data: "4"}, {label:"delta", data: "8"}];

Класс ImageSnapshot (Flex SDK 3)

В третьем SDK появился класс ImageSnapshot, который облегчает работу при создании скриншотов UI-компонентов. Класс ImageSnapshot имеет несколько методов для создания снэпшотов компонентов и кодирования их в PNG или JPEG изображения. В дополнение к этому классу появились также PNGEncoder, JPEGEncoder, Base64Encoder и Base64Decoder, которые раньше были в as3corelib.

mx.graphics.codec.JPEGEncoder
mx.graphics.codec.PNGEncoder

mx.graphics.codec.IImageEncoder


Интерфейс IImageEncoder служит для классов, которые перекодируют объекты BitmapData в ByteArray. Два вышеназванных класса (PNGEncoder и JPEGEncoder) имплементируют этот интерфейс. Если вы захотите написать свой перекодировщик, то он должен имплеменировать этот интерфейс тоже.

mx.graphics.ImageSnapshot

Класс ImageSnapshot облегчает работу с захватом снимков Flex-компонентов. Применений этому множество: создание отражений, или, например, сохранение изображений у пользователя.

Если раньше для получения Base64-строки снимка Flex UI-компонента необходимо было сделать так:

private function getBase64String(component:UIComponent):String) {
var bitmapData:BitmapData = new BitmapData(component.width, component.height, true, 0xffffff);
bitmapData.draw(component);

var bytes:ByteArray = PNGEncoder.encode(bitmapData);

var b64encoder:Base64Encoder = new Base64Encoder();
b64encoder.encodeBytes(bytes);

var b64String:String = b64encoder.flush();

return b64String;
}


То теперь нам поможет класс ImageSnapshot:

captureBitmapData
Этот метод возвращает объект BitmapData, ограниченный 2880 px по ширине и высоте.

captureImage
Этот метод возвращает объект ImageSnapshot. В параметре функции можно передать тип кодировки - PNG или JPEG.

После получения объекта ImageSnapshot мы имеем ByteArray изображения, который потом можно использовать по своему усмотрению.

encodeImageAsBase64
Этот метод получает объект ImageSnapshot и кодирует его в Base 64 строку.

Итак, перепишем наш пример:

private function getBase64String(component:UIComponent):String) {
var snapshot:ImageSnapshot = ImageSnapshot.captureImage(component);
var b64String:String = ImageSnapshot.encodeImageAsBase64(snapshot);
return b64String;
}


или в одну строку:

private function getBase64String(component:UIComponent):String) {
return ImageSnapshot.encodeImageAsBase64(ImageSnapshot.captureImage(component));
}


Обход максимального размера в 2880 px
Для захвата компонентов с большим размером есть метод captureAll, который создает несколько объектов BitmapData и объединяет их в один ByteArray. Но здесь есть ограничение - максимум 256Мб для ByteArray.

Итак, ничего нового, просто все приведено в порядок и собрано в одном месте, что позволяет сэкономить пару-тройку строк кода:)

Различия между Flex SDK 2.01 и 3

Все различия данных версиях можно наглядно посмотреть здесь. Страница еле грузится, правда.

пятница, июня 08, 2007

Flex 3 - баги DeepLinking в Firefox

Тед Патрик обрадовал диплинкингом, который будет встроен в 3 Флексе. (1 и 2) Но, еще работая с SWFAddress, я заметил следующий баг в Firefox'е: если зайти в адресную строку для ручного изменения адреса, а потом перевести фокус обратно на страницу, то адресная строка перестает редактироваться и весь DeepLinking отрубается, до тех пор, пока не перезайти на эту вкладку с другой. Как говорит автор SWFAddress, это баг Firefox и победить его пока не получилось.

понедельник, июня 04, 2007

Экспорт изображения без помощи сервера

Почти все браузеры, кроме IE, поддерживают data: URI scheme, то есть для отображения изображения можно в src передавать не ссылку на него, а его код. Например, так выглядит красная точка:

<img src="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />


Правда, отображать таким образом можно относительно небольшие изображения, зато появляется возможность создавать live-скриншоты приложения без помощи сервера.

Хороший пример с исходным кодом есть у Дуга МакКуна.

среда, мая 30, 2007

Подсветка ActionScript 3

Вышла опенсорсная (BSD) библиотека для подсветки AS3 кода. Вот наглядный примерчик. Скачать библиотеку можно отсюда

вторник, мая 29, 2007

Flex 2.0.1 Hotfix 2

Flex 2.0.1 Hotfix 2. Исправлено:

- ошибки в работе Flex Builder и Flex debugger под Flash Player 9 (9.0.45.0) в Мозилле.

- добавлена поддержка ASDoc для Linux, исправлены ошибки запуска ASDoc под Mac и Linux.

- Утечки памяти в Accordion и ViewStack

- RTE из ListBase при клике на датагриде, ошибки неправильного горизонтального скролирования датагрида при скрытии/отображении последней колонки.

- Ошибки твинига дерева при отображении скроллбаров и ошибки отображения данных при удалении нода.

- Изменение compc для использования SourceList.

- Атрибут uri для тега в catalog.xml теперь опционален.

- Пофиксены LineStyle2 и ButtonRecord2.

- unscaledWidth/unscaledHeight теперь public и read/write.

- Нажатие на полосу прокрутки не работает, если она заскинована

- Удален ExcludeClass metadata из AbstractWebService.

Установка стандартная: забэкапить старый SDK и перезаписать на старый новый.

пятница, мая 25, 2007

Класс Tweener

Открыл для себя класс Tweener, с помощью которого можно легко создавать программную анимацию и различные эффекты. Он реализован как для AS2, так и для AS3, при этом код менять не надо.
С помощью этого класса и Papervision3d создан прикольный каталог для ITunes.

Вот небольшой пример кода:

Tweener.addTween(UITarget, {x:selectedGoTo.x, y:selectedGoTo.y, z:selectedGoTo.z-bounceAmount+UISpacing, rotationX:0, rotationY:180, rotationZ:0, time:primeTransTime, transition:transEquation});

Прикольно то, что твининг можно задавать в трех измерениях, а также вращать элемент вокруг своих осей.

среда, мая 16, 2007

D.eval() - eval() для Flex

D.eval() (Дивал) - библиотека, позволяющая во Flex приложеняих исполнять текстовые строки как ActionScript-выражения. Выглядит он следующим образом:

import com.riaone.deval.D;
var six:int;
six = D.eval("4 + 2") as int;
six = D.evalToInt("var x=0; for(i=1;i<=3;++i)x+=i;return x");
six = D.evalToInt("a * b", {a:2, b:3});
six = D.evalToInt("f(5)", {f:function(x:int):int{return x+1}});
six = D.evalToInt("xml.@size*2", {xml:});
six = D.evalToInt('xml=; return xml.@size*2');


Язык, используемый в D.eval() - это Deval. Он поддерживает все AS3 выражения, включая E4X; он имеет доступ к AS3 классам и функциям, но сам их не задает. Типа, новый шаг в разработке Flex-приложений.

Загрузить можно здесь.

APE - Actionscript Physics Engine

APE - 2d движок для Flash/Flex. Скачать версию 0.3 alpha можно отсюда. Есть небольшое демо, а также можно выполнить урок для начала работы с движком во Flex Builder.

Прикольная демка Papervision/Flex

пятница, мая 04, 2007

AS3 String Utils

Класс с расширенными методами управления строками.

API:
afterFirst
adterLast
beginsWith
beforeFirst
beforeLast
between
block
capitalize
contains
countof
editDistance
endsWith
hasText
isEmpty
isNumeric
padLeft
padRight
properCase
quote
remove
removeExtraWhiteSpace
reverse
reverseWords
similarity
stripTags
swapCase
trim
trimLeft
trimRight
wordCount
truncate

четверг, апреля 26, 2007

Открываем ссылки в новом окне

Современные браузеры зачастую блокируют ссылки, открывающиеся в новом окне. Firefox также не является исключением. При этом (в зависимости от настроек блокировщика) у него появляется маленький крестик внизу, о миссии которого сложно догадаться с первого раза. Так как не все флексовые приложения использую SWFAddress, то открыв ссылку в этом же окне и вернувшись назад мы получаем исходный вид приложения, что является крайне неюзабельным. Поэтому, часто сразу ссылки открывают в новом окне, которое и блокируется. Чтобы этого избежать, некто Сергей Ковалев предлагает открывать окна через жаваскриптовый window.open. Все отлично работает, спасибо за метод борьбы:). Но теперь остается еще одна проблема: во флексе ссылки не открываются из Label. Чтобы решить эту проблему, можно совместить вышеприведенный метод с новым текстовым событием LINK следующим образом:

...
[Bindable] private var str:String = '<a href="event:http://www.ya.ru">www.ya.ru</a>';
...

<mx:Label selectable="true" htmlText="{str}" link="URLUtil.openWindow(event.text)"/>


Теперь все в порядке.

среда, апреля 18, 2007

AS3 карты

Даррон Шелл создал на гугл-коде раздел as3cards, который содержит скинуемый движок по созданию карточных игр (например, Klondike).
SVN

понедельник, апреля 16, 2007

FDT 3.0 beta

Powerflasher'ы анонсируют выход беты известного Eclipse-плагина FDT третьей версии с поддержкой конечно же AS3. Стоить сие творение будет 299 евро, а вот апгрейд с 1.5. версии всего 99. Релиз планируется на июль. Из новых фич ничего толком не объявлено: совместимость с флексом, улучшенная производительность и много очень полезных улучшений:)

понедельник, апреля 02, 2007

HTMLRenderer - больше, чем htmlText!

Хотите, чтобы Flex отображал нумерованный список, изображения с всплывающими альтами и цветными бордерами, разукрашенные таблицы со всякими колспанами и роуспанами? И еще, чтобы задано это было простыми html тегами/аттрибутами, обернутыми в конструкции OL, TEXT, IMAGE и GRID? Пожалуйста!



HTMLRenderer далеко не универсален, но всего функционала и впихнешь, а если и впихнешь, то можно получить какой-нибудь браузер:)

среда, марта 21, 2007

SWFZ - еще один 3D движок

Одновременно с Papervision3D некто jhalse разрабатывает свой движок SWFZ, который является портированным на AS движком Irrlicht, написанным на C++. Прогресс создания создания движка можно посмотреть здесь.

Примеры:
DOOM ?!
Танцующий динозаврик
Использование материалов для модели

воскресенье, марта 18, 2007

Семейство Flex Explorer

Flex Style Creator - создание css-стилей приложения.
Flex Primitive Explorer - создание графических примитивов.
Flex Filter Explorer - создание графических фильтров.
Flex Transitions and Effects Explorer - эффекты и переходы.

четверг, марта 15, 2007

Flex 2.0 Primitive Explorer

Flex 2.0 Primitive Explorer - простой способ создания графических примитивов (звездочек, треугольников, дуг, секторов и т.п.) Примитивы можно разукрашивать в свое удовольствие. Необходимый код генерируется тут же.