Flash-карта. "Создание объектов для перемещения"

Ямкина Елена Владимировна

Flash-карта

“Создание объектов для перемещения”

Выполнение проекта:

1. Открыть программу “Macromedia Flash MX 2004”

2. В открытой закладке “Свойства” определить ширину и высоту будущего фильма, цвет фона

3. Слой1, выделить 1 кадр (щелкнуть на нем ЛКМ), встать на него стрелкой (так, чтобы под ней появился пунктирный прямоугольник), с нажатой ЛКМ протянуть кадр на 2-ой, отпустить ЛКМ, снова нажать ЛКМ, вернуть на 1-ый кадр. Внешний вид кадров будет выглядеть так: 1 кадр с кружком, второй кадр с прямоугольником

4. Встать на 1 кадр

5. Возьмите инструмент Текст “А”

6. Разместите на экране объекты “Текст”, в которых пишутся надписи, они будут при показе неподвижны

7. Теперь займемся размещением подвижных объектов

8. Разместим изначально на поле их в объекте “Текст”, затем взять инструмент Выделение (черная стрелка), ПКМ на объекте, Преобразовать символ…, Имя можно не менять, Метод – Клип.

9. Открыть закладку “Действия-клип”, написать скрипт свободного перемещения:

on (press) {

StartDrag (this); }

on (release) {

StopDrag (); }

Данные операции повторить для каждого подвижного объекта (не забыть, что каждый из них должен представлять из себя клип изображения)!!!

10. Кнопка “Проверка” представляет из себя обычный объект Овал с любой заливкой, с объектом “Текст” - произвольная надпись. Все это сгруппировываем и преобразуем в Клип “Кнопка” (взять инструмент Выделение, отметить кнопку с надписью, ПКМ на объекте, Преобразовать символ…, Имя можно не менять, Метод – Кнопка)

11. Открыть закладку “Действия-клип”, к ней применяется скрипт

on(press){

gotoAndPlay(2);

}

12. Подготовительный этап закончен

13. На временной шкале встать на 2 кадр, выделить его, ПКМ, Вставить клавиатуру – это будет кадр с ответами. В нем находятся те же объекты, что мы создавали в первом кадре. Поэтому, размещаем их, и устанавливаем так, как они должны выглядеть в ответе

14. Удаляем из вкладки Действия все скрипты, которые были установлены для перемещения этих объектов (Только во 2-м кадре!!!).

15. Повторить п.10 для кнопки “Назад”, и скрипт для нее будет

on(press){

gotoAndPlay(1);

}

16. В каждом кадре щелкаем по фону (кроме фона ничего не должно быть выбрано! Для этого можно щелкнуть вне поля изображения, затем выделить фон), и во вкладке Действие-кадр и прописываем скрипт

stop()

17. Примеры проектов находятся на http://shk37.simd.ru/flash_karty.html

Задание 1:

Постановка задачи: “Чем потчует своих героев М.А.Булгаков”

1. Перед Вами стол с яствами: ананас; водка; черная икра; перец; сосиски в томате; белые маринованные грибы; соль; спирт; аккуратно нарезанная селедка, густо присыпанная зеленым луком; паюсная икра в вазочке; нарезанный белый хлеб; водка в графинчике; огненный густой борщ с мозговой косточкой.

2. Разнесите представленные здесь блюда трем господам:

Никонору Ивановичу Босому на обед

Бегемоту на ужин при камельке

Степе Лиходееву для лечения

3. Кнопка “Проверить” - переход на следующий кадр для проверки результатов расстановки объектов

4. Правильные ответы:

Никонору Ивановичу Босому на обед - водка; аккуратно нарезанная селедка, густо присыпанная зеленым луком; огненный густой борщ с мозговой косточкой

Бегемоту на ужин при камельке – спирт, ананас, соль, перец, черная икра

Степе Лиходееву для лечения - водка; паюсная икра в вазочке; нарезанный белый хлеб; белые маринованные грибы; сосиски в томате.

5. Кнопка “Назад” - переход на первый кадр для повторной расстановки объектов

6. Файл Приложение1.swf – реализация данного проекта

Задание 2:

Постановка задачи: “Перетащите обозначения-буквы для названия углов”

1. Рисунок круга, каждый сектор которого раскрашен разным цветом

2. Центр круга – точка О

3. Обозначения – буквы (от А до Н)

4. Надписи: Тупой угол, Прямой угол, Острый угол

5. Необходимо задать движение буквам для расстановки обозначений углов

6. Нюанс: Обозначения каждой буквы необходимо после присвоения скриптов скопировать раз 7-10 – чтобы можно было одну и ту же букву ставить несколько раз!!! Для удобства группируем все буквы и копируем сразу оптом!

7. Файл Приложение2.swf – реализация данного проекта

Задание 3:

Постановка задачи: “Построение углов”

1. Заготовки линий для построения тупого, острого и прямого углов

2. Соответствующие надписи – “Постройте тупой угол (более 90)”, “Постройте острый угол (менее 90)”, “Постройте прямой угол (90)”

3. Кнопка “Далее”

4. На 2 слайде заготовка прямых для построения 2-х треугольников

5. Кнопка “Назад”

6. Можно разместить объекты линий, кнопки и надписи на различных слоях

7. Файл Приложение3.swf – реализация данного проекта

Flash-карта

“Создание объектов для выбора кликом – изменение прозрачности”

Выполнение проекта:

1. Открыть программу “Macromedia Flash MX 2004”

2. В открытой закладке “Свойства” определить ширину и высоту будущего фильма. Цвет фона не выбираем – он будет установлен другим образом

4. На 2-м кадре ПКМ – Вставить клавиатуру

5. Фоном для 1 кадра будет являться прямоугольник. Его растянуть во весь экран проекта. “Преобразовать символ…” - “Клип”. В свойствах дать имя инстанции – fon

6. Объекты для выбора (рисунки, фотографии) добавляются в библиотеку – “Файл” - “Импорт” - “Импортировать в библиотеку…” и размещаются на экране. Показать библиотеку можно через меню Окна. Для изменения размера картинки – ПКМ – Свободная трансформация

7. Все рисунки преобразовываются в Клип

8. Каждому рисунку присваивается скрипт:

on(press) {

if (this.hitTest(_root.fon))

{this._alpha=50;

}else {

this._alpha=100;}}

9. Кнопка “Ответ” прописывается скриптом

on(press){

gotoAndPlay(2);

}

Для кнопки “Назад” - скрипт тот же самый, но для оператора gotoAndPlay ставим (1) для возврата в первый кадр

10. В каждом кадре щелкаем по прямоугольнику фона и во вкладке Действие-кадр прописываем скрипт stop()

Задание 1:

Постановка задачи: “Около дома Мастера был замечательный зеленый дворик. Какие деревья там росли?”

1. Картинки деревьев – Ель, Дуб, Туя, Сосна, Клен, Жасмин, Береза, Сирень, Акация, Липа (обработать в Adobe PhotoShop, размер примерно 200*250)

2. Правильные ответы: Сирень, Липа, Клен

3. Файл Приложение4.swf – реализация данного проекта

4. Файлы с картинками деревьев и пример проекта расположены по адресу: http://shk37.simd.ru/flash_karty.html

Flash-карта

“Создание объектов для выделения с увеличением и поясняющим текстом”

Выполнение проекта:

1. Открыть программу “Macromedia Flash MX 2004”

2. В открытой закладке “Свойства” определить ширину и высоту будущего фильма

3. Импортировать в библиотеку необходимые фотографии (заранее их подготавливаем, например в редакторе Adobe PhotoShop, для приведения примерно к одному геометрическому размеру и размеру в Кб. Для этого сохраняем все изображения в режиме “Для Web”), разместить их на поле. Выкладываем их на Слой 1

4. Команда меню Просмотр – Линейки позволяет видеть позиционирование изображения при расстановке. Размеры корректируются на вкладке Свойства

5. Для выравнивания объектов на поле ПКМ – Сетка – Показать сетку, а также использовать вспомогательные направляющие линии. Они выводятся на рабочее поле при наведении курсора на координатные линейки с нажатием ЛКМ. Потянув за него, мы выведем направляющие на экран

6. Фон оформляем отдельным слоем, он должен быть расположен ниже всех (перетаскиваем его ЛКМ на временной панели вниз)

7. На линейке времени добавляем еще 5 кадров (всего будет 6, т.к. 5 фотографий и одно окно текста) – на первом кадре будет закрашенный кружок, последний - с прямоугольником

8. Слой фона можно скрыть (чтобы он не был видим), тогда снова станет видна сетка для позиционирования фотографий, или заблокировать, тогда нужно использовать направляющие

9. Сами объекты (фото актеров) размещаем на поле фильма. Выравниваем их

10. При необходимости на панели свойства замечаем, что нужная высота фотографии, например, 150 пикселов, устанавливаем ее вручную. Если активизирован “замочек”, то пропорционально изменится и ширина, изображение не исказится

11. Все фотографии и среднее поле для текста преобразовываем в Символ – Кнопка

12. На каждую кнопку ставим скрипт:

on(press) {

gotoAndPlay (№ кадра, выбираемый кнопкой);

}

№ кадра для текста – 1, для первой фотографии - 2 и т.д.

Важно: все кнопки должны находиться на одном слое, в нашем случае – верхний Слой 2

13. Сделаем раскадровку фильма

14. Выделить слой с фотографиями, отметить на нем все кадры ЛКМ (справа-налево!!!) так, чтобы все они стали черными, затем ПКМ – Преобразовать в клавиатуры. Все они станут самостоятельными кадрами с черными точками

15. Встаем на 1 кадр этого же слоя. Пишем заголовок. CHARMED и добавляем текст на поле текста. Чтобы текст был сверху, на поле кнопки, по необходимости фон для текста ПКМ – Расположить – Поместить сзади

16. На 2 кадре – к 1 фотографии, Заголовок и Текст и т.д.

17. Выделяя каждый кадр, начиная с 1-го, во вкладке Действия-Кадр ставим скрипт stop()

18. Далее в каждом кадре, начиная со 2-го, вначале щелкаем ВНЕ экрана, затем по той фотографии, которая принадлежит этому кадру и в Свойствах увеличиваем ее размер. Положение фотографии можно подкорректировать стрелками. Удаляем скрипт перехода

19. Пример проекта расположен по адресу: http://shk37.simd.ru/flash_karty.html

Задание 1:

Постановка задачи: “Зачарованные”

1. По периметру экрана разместить фотографии актеров

2. По центру – текст

3. По щелчку на фотографии она увеличивается, сверху – надпись, по центру появляется биография выбранного актера

4. По щелчку на месте с текстом – в нем появляется надпись о самом сериале, заголовок меняется

5. Файл Приложение5.swf – реализация данного проекта

6. Файлы с фотографиями актеров и пример проекта расположены по адресу: http://shk37.simd.ru/flash_karty.html

Список литературы:

Переверзев С.И. Анимация в Macromedia Flash MX/С. И. Переверзев. – М.: БИНОМ. Лаборатория знаний, 2005.
Лещев Д.В. Flash MX 2004/ Теория и практика. Самоучитель. – СПб.: Питер, 2004.
Ульрих К. Macromedia Flash MX 2004 для Windows и Macintosh/Катерина Ульрих; Пер. с англ. Осипова А.И. – М.:ДМК Пресс; СПб.: Питер, 2004.

27.03.2007