AS 3.0 - простая кнопка

Создание кнопки при помощи графических средств Adobe Flash – это дело нескольких кликов, но когда мне понадобилось сделать тоже самое в чистом ActionScript, то я встал в тупик. Правда ненадолго.

Предлагаю вашему вниманию класс кнопки с текстом и, естественно, действием на клик.

package ui 
{
    import flash.display.Shape;
    import flash.display.SimpleButton;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.text.TextField;
    import flash.text.TextFormat;
    import flash.text.TextFieldAutoSize;
    import flash.events.MouseEvent;
 
    public class Button extends Sprite
    {
        private var button_obj : SimpleButton;
        private var _label : String;
        private var _width : uint   = 100;
        private var _height : uint  = 30;
 
        private var upColor : uint      = 0xC0C0C0;
        private var overColor : uint    = 0xE2E2E2;
        private var downColor : uint    = 0xFFFFFF;
 
        private var _handler : Function;
 
 
        public function set click(handler : Function) : void
        {
            _handler = handler;
            addEventListener(MouseEvent.CLICK, clickHandler);
        }
 
        private function clickHandler(e : MouseEvent) : void
        {
            _handler();
        }
 
        public function Button( width : uint = 0,
                                height : uint = 0,
                                label : String = '')
        {
            _label = label;
 
            if (width > 0)
                _width = width
 
            if (height > 0)
                _height = height
 
            button_obj = new SimpleButton;
 
            button_obj.downState =
                stateObject(downColor, _width, _height);
 
            button_obj.overState =
                stateObject(overColor, _width, _height);
 
            button_obj.upState =
                stateObject(upColor, _width, _height);
 
            button_obj.hitTestState =
                stateObject(upColor, _width, _height);
 
            button_obj.useHandCursor = true;
 
            addChild(button_obj);
 
            var text_label : TextField = createLabel();
 
            text_label.x = Math.round(width * 0.5
                        - text_label.width * 0.5);
 
            text_label.y = Math.round(height * 0.5
                        - text_label.height * 0.5);
 
            addChild(text_label);
        }
 
        private function stateObject(   color : uint,
                                        width : uint,
                                        height : uint) : Shape
        {
            var shape : Shape = new Shape;
 
            shape.graphics.beginFill(color);
            shape.graphics.drawRect(0, 0, width, height);
            shape.graphics.endFill();
 
            return shape;
        }
 
        private function createLabel() : TextField
        {
            var format : TextFormat =
                new TextFormat('_sans', 11);
 
            var text_label : TextField  = new TextField();
 
            text_label.selectable   = false;
            text_label.mouseEnabled = false;
            text_label.autoSize     = TextFieldAutoSize.LEFT;
            text_label.defaultTextFormat = format;
            text_label.text         = _label;
 
            return text_label;
        }
    }
}

По сути это класс SimpleButton, с присоединённым текстом, который выравнен по центру. Использовать его можно, например, так:

// button Hello
var butt_hello : Button = new Button(100, 30, 'Hello');
 
butt_hello.x = 10;
butt_hello.y = 210;
 
butt_hello.click = function () : void { trace('Hello!') };

Социальная Flash-игра — Игровое поле

Этот этап занял некоторое время. Хорошо что нашёлся ещё один пример с открытым кодом от Adam Zwakk, что мне очень помогло:

Создать игровое поле было довольно просто, особенно имея в наличии примеры реализации. Но были и ошибки с которыми я столкнулся как новичок. Кроме того в примерах я не нашёл части нужной функциональности, которую пришлось доделывать самому.

Основной проблемой было ограничить скроллинг игрового поля, и при этом позволить пользователю масштабировать это же поле. Поэтому я сделал отдельный пример с моим решением этой проблемы.

Вот код примера: скачать. А дальше я расскажу об основных препятствиях.

Система координат

Первым делом необходимо понять систему координат. Поначалу не разобравшись как следует сделал лишнюю работу, прежде чем понял что к чему.

Изображение в As3Iso.lib строится следующим образом:

• IsoView - {x = 0; y = 0} в центре экрана, положительные значения вверх и влево.
• IsoScene – координат не содержит
• IsoSprite - имеет доступ к двум системам координат:
• 1. IsoSprite.container – (спрайт отображающий объекты IsoSprite) {x = 0; y = 0} в центре экрана, но положительные значения вправо и вниз.
• 2. Изометрические координаты IsoSprite, о которых сейчас речь не идёт.
• Sprite – {x = 0; y = 0} в центре экрана, положительные значения вправо и вниз.

Масштабирование и скроллинг

Масштабирование и скроллинг по отдельности устроены довольно просто. Но совмещение этих двух вещей с наложением ограничений на скроллинг может стать проблемой.

Чтобы ограничить скроллинг создаётся специальный спрайт, размером превышающий окно игры и прикреплённый к текущему IsoView следующим образом:

pan_limit_sp = new Sprite();
// задаётся размер и положение в пространстве
updatePanLimitSize(); 
view.backgroundContainer.addChild(pan_limit_sp);
 
view.rangeOfMotionTarget = pan_limit_sp;
view.limitRangeOfMotion  = true;

После этого скроллинг возможен до тех пор пока окно игры расположено в пределах «pan_limit_sprite».

При масштабировании «pan_limit_sprite» должен соотвественно менять размер и положение чтобы границы окна игры постоянно находились внутри него, иначе эта система не будет работать.

Полное решение можно посмотреть в коде примера (ссылка на скачивание выше). Масштабирование выполняется колесом мышки. Попробуйте увеличить спрайт до максимума, передвинуть до упора в любую из сторон, затем уменьшить до минимума.

Социальная Flash-игра — Начало

Уже довольно давно я мечтаю о том, чтобы создать игру. Мною было предпринято несколько попыток, которые так и остались наполовину начатыми. Поэтому теперь в приоритете довести проект до завершения.

(скриншот из игры "Game Dev Story")

Почему игру? Наверное потому что это то что всегда меня привлекало в компьютерах в первую очередь, а также потому что это, вероятно, наиболее сложный тип программы. И вообще, создать даже небольшой мирок, по-моему, очень интересно.

Это будет онлайн-игра для социальных сетей (предположительно ВКонтакте). В качестве платформы я беру Flash, как наиболее распространённую на десктопах.

Сюжет не будет оригинальным и будет напоминать «фермы», потому что сейчас для меня важна техническая сторона и не менее важно довести разработку до завершения.

На первом этапе я хочу выполнить программу-минимум:

1. игровое поле (скроллинг, зум);
2. юниты (выделить, направить);
3. здания (выбрал в меню, построил).

Думаю что потом уже можно будет думать о механике самой игры, хотя допускаю что я ошибаюсь.

Помимо клиентской, есть ещё и серверная часть. Судя по всему PHP для этого не очень подходит, но я буду делать сервер на PHP, потому что хорошо с ним знаком. Позднее, если возникнут проблемы использую что-нибудь другое, например Java или Node.js.

Ах да..., нужно ещё всё красиво нарисовать. По ходу дела буду рисовать (искать арт) сам, потом буду решать этот вопрос отдельно.

Мой опыт с Flash мнимален, поэтому придётся учиться походу дела. В качестве инструментов разработки я выбрал:

1. as3isolib, просто потому что эта библиотека попалась мне первой, она бесплатна, у неё есть документация и, главное, есть пример с открытым кодом: Anggie Bratadinata's Adobe Camp Jakarta Demo (Thanks Anggie!!!);
2. FlashDevelop — взятый мною пример использования as3isolib был создан с помощью этого редактора, он бесплатен.

Думаю, что более осознанный выбор инструментов я сейчас не смогу сделать в виду отсутствия опыта.

Установка инструментов проблем не создаёт. Беру демо Anggie и начинаю. Посмотрим что получится.

О каждом пройденном пунтке я буду писать отчёт.