Создание простых кнопок

Класс SimpleButton обеспечивает пользователю возможность взаимодействовать с отображаемым объектом с помощью мыши, а разработчику описывать это взаимодействие через различные состояния кнопки. Возможные состояния кнопки доступны как свойства класса SimpleButton:

1) upState (кнопка не нажата)

Отображаемый объект для стандартного состояния кнопки («не нажата»). В этом состоянии кнопка находится, когда курсор мыши не над ней.

2) overState (мышь над кнопкой)

Отображаемый объект, определяющий, как выглядит кнопка, когда по ней проводят курсором мыши. Когда курсор покидает область кнопки, она возвращается в состояние «не нажата».

3) downState (кнопка нажата)

Отображаемый объект, предназначенный для представления кнопки, когда она «нажата» (или по ней щелкнули). Кнопка переходит из состояния «мышь над кнопкой» в состояние «нажата», когда пользователь нажимает левую кнопку мыши.

4) hitTestState (активная зона)

Отображаемый объект, определяющий границы кнопки. Кнопка, в активную зону которой попадает курсор мыши, переходит в состояние «мышь над кнопкой». Обычно для состояния hitTestState задан тот же отображаемый объект, что и для upState. Фактически, hitTestState никогда не отображается на экране, это состояние нужно только для отслеживания движений мыши.

Состояние мыши обрабатывается классом SimpleButton и основывается на перемещениях мыши. Нельзя управлять внутренней настройкой состояния кнопки (не нажата, нажата или мышь над кнопкой), можно только задать отображаемый объект, который будет отражать то или иное состояние.

Пример 1. Создается экземпляр класса SimpleButton и с помощью четырех свойств описываются состояния кнопки. Каждому свойству состояния кнопки должен задается экземпляр класса DisplayObject. Поэтому задействуется вспомогательный метод createCircle() для создания кругов разных цветов, применяемых в различных состояниях:

package {

import flash.display.*;

import flash.events.*;

public class Example1 extends Sprite

 {

public function Example1()

{

// Создаем кнопку и задаем ее местоположение

var button1:SimpleButton = new SimpleButton();

button1.x = 20;

button1.y = 20;

// Создаем разные состояния кнопки

// Используя вспомогательный метод,

// создаем круги разных цветов

button1.upState = createCircle(0x00FF00, 15);

button1.overState = createCircle(0xFFFFFF, 16);

button1.downState = createCircle(0xCCCCCC, 15);

button1.hitTestState = button1.upState;

// Добавляем слушатель события click, чтобы знать,

// когда пользователь щелкает кнопку мыши

button1.addEventListener(MouseEvent.CLICK, fClick);

// Наконец, добавляем кнопку в список отображения

addChild(button1);

}

// Вспомогательная функция для создания круга

// заданного цвета и радиуса

private function createCircle(color:uint, radius:Number):Shape

{

var circle:Shape = new Shape();

circle.graphics.lineStyle(1, 0x000000);

circle.graphics.beginFill(color);

circle.graphics.drawCircle(0, 0, radius);

   circle.graphics.endFill();

return circle;

}

// Обработчик события, вызываемый при нажатии кнопки

private function fClick(event:MouseEvent):void

{

button1.x += 20;

button1.y += 20;

}

 }

}

 

Пример 2. То же что пример 1, только отображение кнопки осуществляется с помощью объектов-наследников класса MovieClip из библиотеки.

package {

import flash.display.*;

import flash.events.*;

public class Example2 extends Sprite

 {

public function Example2()

{

var button1:SimpleButton = new SimpleButton();

button1.x = 20;

button1.y = 20;

button1.upState = new kvadrat();

button1.overState = new kvadrat_b();

button1.downState = new kvadrat_g();

button1.hitTestState = button1.upState;

  button1.addEventListener(MouseEvent.CLICK, fClick);

addChild(button1);

}

 

private function fClick(event:MouseEvent):void

{

trace("Вы нажали мышью на кнопке");

}

 }

}

Таблица 1 – Связь свойства type класса MouseEvent с именем стандартного события

Константа, задающая значение свойства type Событие Назначение события
CLICK Click Нажатие и последующее отпускание основной кнопки мыши над одним и тем же объектом InteractiveObject. Или активизация пользователем экземпляра класса SimpleButton, Sprite или MovieClip клавишей Пробел или Enter
DOUBLE_CLICK doubleClick Два события MouseEvent.CLICK, происходящих одно за другим над одним и тем же объектом InteractiveObject
MOUSE_DOWN mouseDown Нажатие основной кнопки мыши, когда указатель мыши находится над областью отображения приложения Flash Player
MOUSE_MOVE mouseMove Указатель мыши перемещается над областью отображения приложения Flash Player
MOUSE_OUT mouseOut Указатель мыши переместился за границы отображаемого объекта
MOUSE_OVER mouseOver Указатель мыши переместился на отображаемый объект
MOUSE_UP mouseUp Отпускание основной кнопки мыши, когда указатель мыши находится над областью отображения приложения Flash Player
MOUSE_WHEEL mouseWheel Когда приложение Flash Player имело системный фокус, было использовано устройство прокрутки мыши
ROLL_OUT rollOut Указатель мыши прежде переместился на некоторый объект InteractiveObject или одного из его потомков, но больше не находится над этим отображаемым объектом или одним из его потомков
ROLL_OVER rollOver Указатель мыши переместился на некоторый объект InteractiveObject или на одного из его потомков

 

Задание. Создать объект-наследник класса MovieClip, две кнопки и два текстовых поля. По нажатию на первую кнопку перемещать объект вправо, по нажатию на вторую кнопку перемещать объект влево. Количество нажатий на кнопки хранить в текстовых полях.

 

package {

import flash.display.*;

import flash.events.*;

import flash.text.*;

public class Example3 extends Sprite

 {

var sun1:sun; // Объявлен объект класса sun

var text1:TextField; // Объявлен объект класса TextField

var text2:TextField;

public function Example3()

{

   // Создание кнопок

var button1:SimpleButton = new SimpleButton();

button1.x = 100;

button1.y = 20;

button1.upState = new kvadrat();

button1.overState = new kvadrat_b();

button1.downState = new kvadrat_g();

button1.hitTestState = button1.upState;

        

var button2:SimpleButton = new SimpleButton();

button2.x = 300;

button2.y = 20;

button2.upState = new kvadrat_b();

button2.overState = new kvadrat();

button2.downState = new kvadrat_g();

button2.hitTestState = button2.upState;

// Создание текстовых полей

    text1 = new TextField(); // Вызываем конструктор для объекта text1

    text1.text = "0";

    text1.x = 100;

    text1.y = 40;

      text2 = new TextField();

      text2.text = "0";

    text2.x = 300;

    text2.y = 40;

// Создание наследника класса MovieClip

       sun1 = new sun();

    sun1.x = 50;

    sun1.y = 260;

   

// Добавление слушателей событий для кнопок

button1.addEventListener(MouseEvent.CLICK, fun1);

  button2.addEventListener(MouseEvent.CLICK, fun2);

   

// Добавление объектов в список отображения

      addChild(button1);

    addChild(button2);

    addChild(text1);

    addChild(text2);

    addChild(sun1);

}

// Определение слушателей

private function fun1(event:MouseEvent):void

{

sun1.x += 10; // Перемещение объекта

 text1.text = String(parseInt(text1.text) +1); // Увеличение значения счетчика

                                              // нажатий на кнопку

}

private function fun2(event:MouseEvent):void

{

sun1.x -= 10;

  text2.text = String(parseInt(text2.text) +1);

}

 }

}

Варианты заданий.

1. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект влево вниз, по нажатию на вторую кнопку перемещать второй объект вправо вверх. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – количество нажатий на обе кнопки.

2. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект влево вверх, по нажатию на вторую кнопку перемещать объект вправо вниз. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – разность между количеством нажатий на первую и вторую кнопки.

3. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект вправо вниз, по нажатию на вторую кнопку перемещать объект влево вверх. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – разность между количеством нажатий на вторую и впервую кнопки.

4. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект вправо вверх, по нажатию на вторую кнопку перемещать объект влево вниз. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – частное от деления количества нажатий на вторую и впервую кнопки.

5. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект влево вниз, по нажатию на вторую кнопку второй объект должен уменьшать прозрачность. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – значение прозрачности второго объекта.

6. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект вниз, по нажатию на вторую кнопку второй объект должен уменьшать ширину. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – значение ширины второго объекта.

7. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект вверх, по нажатию на вторую кнопку второй объект должен уменьшать высоту. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – значение высоты второго объекта.

8. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект вверх, по нажатию на вторую кнопку второй объект должен изменять угол поворота. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – значение угла поворота второго объекта.

9. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект влево, по нажатию на вторую кнопку второй объект должен увеличивать размер. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – значение ширины второго объекта.

10. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать первый объект влево вниз, по нажатию на вторую кнопку перемещать второй объект вправо вверх. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – количество нажатий на обе кнопки.

11. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект влево вверх, по нажатию на вторую кнопку перемещать объект вправо вниз. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – разность между количеством нажатий на первую и вторую кнопки.

12. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект вправо вниз, по нажатию на вторую кнопку перемещать объект влево вверх. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – разность между количеством нажатий на вторую и впервую кнопки.

13. Создать 2 объекта-наследника класса MovieClip, две кнопки и три текстовых поля. По нажатию на первую кнопку перемещать объект вправо вверх, по нажатию на вторую кнопку перемещать объект влево вниз. Количество нажатий на кнопки хранить в текстовых полях, в третьем поле – частное от деления количества нажатий на вторую и впервую кнопки.

 

 


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: