Инфоурок / Информатика / Рабочие программы / Практические задания по FLAFH- технологии.
Обращаем Ваше внимание, что в соответствии с Федеральным законом N 273-ФЗ «Об образовании в Российской Федерации» в организациях, осуществляющих образовательную деятельность, организовывается обучение и воспитание обучающихся с ОВЗ как совместно с другими обучающимися, так и в отдельных классах или группах.

Педагогическая деятельность в соответствии с новым ФГОС требует от учителя наличия системы специальных знаний в области анатомии, физиологии, специальной психологии, дефектологии и социальной работы.

Только сейчас Вы можете пройти дистанционное обучение прямо на сайте "Инфоурок" со скидкой 40% по курсу повышения квалификации "Организация работы с обучающимися с ограниченными возможностями здоровья (ОВЗ)" (72 часа). По окончании курса Вы получите печатное удостоверение о повышении квалификации установленного образца (доставка удостоверения бесплатна).

Автор курса: Логинова Наталья Геннадьевна, кандидат педагогических наук, учитель высшей категории. Начало обучения новой группы: 27 сентября.

Подать заявку на этот курс    Смотреть список всех 216 курсов со скидкой 40%

Практические задания по FLAFH- технологии.

библиотека
материалов

Практические занятия


Практическое задание №1. Анимация движения облаков и движения яхты.

  1. Откроем новый фильм и скопируем в его библиотеку графический символ рисунка яхты.

4

Рис. 4.1. Слой-фон


  1. Переименуем существующий слой в Фон и нарисуем в нем фоновое изображение. Оно представляет собой два прямоугольника, заполненные градиентной заливкой (рис. 4.1).

  2. Создадим слой 2 и дадим ему название облако 1. Нарисуем в нем объект облако.

  3. Сгруппируем объект. Переместим объект в исходную точку движения. Облако расположено на рабочем столе за пределами кадра (рис. 4.2). С первой секунды фильма оно начнет появляться в кадре, пересечет его справа налево и покинет кадр.

4

Рис. 4.2. Слой 2 - Облако 1.


  1. Создадим третий слой. Назовем его Облако 2. Чтобы не рисовать второе облако скопируем в этот слой объект из слоя Облако 1. Переместим объект в начальную точку движения. Поскольку двух одинаковых облаков на небе не бывает, изменим форму облака, применяя операции трансформации и искажения (рис. 4.3).

4

Рис. 4.3. Слой 3 - Облако 2


  1. Создадим последний слой под названием Яхта (рис. 4.4). Поместим в него символ Яхта из библиотеки. Для этого выберем этот символ из списка символов и переместим его в первый кадр фильма. Таким образом, все слои созданы, объекты размешены каждый на своем слое. Осталось задать их движение.


4

Рис. 4.4. Слой 4 - Яхта


  1. Выберем слой Яхта. Перейдем в 120-й кадр, создадим ключевой кадр и переместим графический символ в конечную точку движения. Щелкнем правой кнопкой мыши на ячейке первого кадра и выберем из контекстного меню команду Create Motion Tween. Будет создана автоматическая анимация движения символа Яхта.

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

  1. Фон должен отображаться в каждом кадре и оставаться неподвижным. Чтобы сделать это, выберем слой Фон. Щелкнем правой кнопкой мыши на ячейке первого кадра и выберем команду Сору Frame. Щелкнем правой кнопкой на ячейке 120-го кадра. Выберем команду Paste Frame. В 120-м кадре будет создан ключевой кадр, содержащий копию первого кадра, а промежуток между ключевыми кадрами заполнится статическими кадрами с изображением фона.

  2. Просмотрим фильм. (Ctrl+Enter).




Практическое задание №2.

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


с подмаской

Рис. 4.11. Временная диаграмма анимации маски


1. Для данной анимации понадобиться 3 слоя. Поэтому добавьте еще 3 слоя (ПКМ/Insert Layer).

3. На самом верхнем слое нарисуйте окружность, конвертируйте ее в Ролик. Создайте движение этого объекта от начало текста до конца.

4. На втором слое, создайте серый фон. На этом же слое напишите какой-нибудь текст белого цвета. Старайтесь, чтобы текст был на весь кадр.

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

6. Выделите все фреймы, находящиеся на втором слое и скопируйте их на третий слой (нижний). Поменяйте фон на черный, а текст на серый.

7. Самый верхний слой сделайте маской. Тогда второй слой автоматически станет под маской (рис 4.11.)

маска

Рис. 4.12. Общий вид анимации


Для того чтобы более эффектно работать со слоями пользуйтесь Видимостью слоя (Глазом) и Возможностью редактирования (Замком).



Практическое задание №3. Перетаскивание объектов

В этом примере мы научимся перемещать объекты с помощью мышки.

  1. Нарисуйте объект, который надо будет перемещать. С помощью F8 конвертируйте его в кнопку (Button). Нажмите правой кнопкой мыши на объекте, зайдите в "Actions" и вставьте следующий скрипт:

on (press) {

startDrag (_parent.obect);

}

on (release) {

stopDrag ();

}

Скрипт работает следующим образом: при нажатии на кнопку (on (press)), срабатывает функция startDrag – возможность открепить объект от листа для ролика (Movie Clip – obejct), а при отпускании кнопки (on (release)) срабатывает функция закрепления объекта в текущей позиции (stopDrag).

  1. С помощью F8 конвертируйте кнопку в Movie Clip, и в панели Prorerties в пункте Instance Name назовите его "obect" (рис. 8.2.)

8

Рис. 8.2.


  1. Все готово. Теперь можно смело перемещать объект, удерживая левой клавишей мыши.



Практическое задание №4. Условный оператор.

Кнопка Play определяет, все ли объекты находятся ниже линии. Если да, то true, иначе – false.


hello_html_21b5ed2a.png

Рисунок 2

  1. Возможность перетаскивать объект реализована в практическом задании №3.

  2. Ниже приведен пример проверки кнопки, согласно условию задачи

on(release) {

if (obj1._y > 240 && obj2._y >240 && obj3._y>240)

t=true; else t=false;

}

Где obj1, obj2, obj3 – названия символа 1,2,3. Чтобы назвать символ, необходимо в Properties в пункте Instance Name.

Переменная t присваевается к Тексту через Properties в Var – раздел описания переменных.







Практическое задание №5. Создание программы тестирования

  1. Расположите на первом ключевом кадре статическое поле (с вопросом), несколько переключателей (с вариантами ответов), динамическое поле (для вывода результата) и кнопку в соответствии с рисунком 8.7.

hello_html_26af661.png

Рис. 8.7. Объекты первого ключевого кадра

Чтобы добавить компоненты Radio Button на кадр, необходимо открыть панель Components.

Необходимо дать собственное имя каждому переключателю (например, для первого варианта ответа a1, для второго – а2, для третьего – а3. Имя компонента настраивается в панели Properties в свойстве Component.

  1. Также необходимо для всех компонентов Radio Button в пункте Change Handler присвоить имя функции-обработчика, например myfun (рис. 8.8)


  1. Задайте подписи каждого Label - значение надписи варианта ответа

hello_html_m1cac27b2.png

Рис. 8.8. Настройки компонента Radio Button1


Для осуществления обратной связи необходимо проверять состояние каждого переключателя. Для этой цели используется метод GetState, который возвращает истинное значение, если переключатель отмечен, и ложное значение в противном случае.


  1. Результатом работы будет сообщение «Верно» или «Неверно», выведенное при помощи динамического поля. Свяжите динамическое поле с переменной res.

Для этого выделите поле и настройте его тип – Dinamic text и укажите в пункте Var переменную res (рис. 8.9).

hello_html_m978311c.png

Рис. 8.9. Настройки динамического поля


  1. Создайте функцию-обработчик myfun. Эта функция будет выводить сообщение в зависимости от выбора пользователя.


function myfun(component){

if (a2.getState() == 1) {

res = "Верно";

} else {

res = "Неверно";

}

р=0

}


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


radio1.setEnabled(false);

radio2.setEnabled(false);

radio3.setEnabled(false);


  1. На первом кадре перед функцией необходимо обязательно поставить команду: stop(); для того, чтобы ролик не крутился бесконечно и можно было работать с тестом.

Скрипт к первому кадру будет выглядеть в соответствии с рис. 8.10.

hello_html_m2a4df664.png

Рис. 8.10.


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

on (release) {

if(a2.selected){

p=p+1;

}

Play ( );

}

где a2 – компонент правильного варианта ответа.


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

res='';

function myfun(component) {

if (a5.getState()==1) {

res="Верно";

} else {

res="Неверно";

}


a4.setEnabled(false);

a5.setEnabled(false);

a6.setEnabled(false);

}


где res=''; - очистка переменной rec; а5 – компонент правильного варианта ответа во втором вопросе; а4, а5, а6 – варианты ответов.

  1. На последнем кадре ставим два динамических текстовых поля, которым даем имена: prav - для вывода количества правильных ответов и oc – для вывода полученной оценки (рис. 8.11).

hello_html_474a98c4.png

Рис. 8.11. Временная диаграмма программы тестирования из 5-ти вопросов.

Вид объектов последнего кадра – результат тестирования.


  1. В панели Actions вводим следующий код на последний ключевой фрейм:

stop();

prav=p;

if (prav<3){

oc="2";

}else if (prav==3){

oc="3";

}else if (prav==4) {

oc="4";

}else {

oc="5";

}

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

Кнопка «Выхода» или закрытие проекта

Action кнопки для закрытия проекта:

on(release){

fscommand("quit", "true");

}



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

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

После окончания обучения выдаётся диплом о профессиональной переподготовке установленного образца с присвоением квалификации (признаётся при прохождении аттестации по всей России).

Обучение проходит заочно прямо на сайте проекта "Инфоурок", но в дипломе форма обучения не указывается.

Начало обучения ближайшей группы: 27 сентября. Оплата возможна в беспроцентную рассрочку (10% в начале обучения и 90% в конце обучения)!

Подайте заявку на интересующий Вас курс сейчас: https://infourok.ru

Краткое описание документа:

Использование векторной графики.

Использование векторной графики как графического режима по умолчанию делает Flash незаменимым средством разработки для Web. Векторная графика – это объекты, определяемыми математическими уравнениями, или векторами, которые содержат информацию о размере, форме, цвете, границе и местоположении. Это эффектный способ обращения с графикой, в результате которого получаются файлы относительно небольших размеров даже при работе со сложными рисунками. Более того, векторная графика не зависит от разрешения, с которым просматривается объект

Векторная графика на сегодня - идеальное решение для разработки Web -сайтов, позволяющее с равной эффективностью воспроизводить изображения практически на всех типах компьютеров (Pc, Mac, NoteBook) и мониторов.

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

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

В отличие от растровых форматов, таких как GIF и JPEG, используемых в сети повсеместно, векторные изображения - графика, тексты, схемы и анимация легко экспортируются в необычайно компактные файлы формата SWF (Shock Wave Flash), которые быстро грузятся и способны потоково проигрываться непосредственно в Сети при помощи обычного броузера.

Технология Symbol Conversation

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

Общая информация

Номер материала: 346722

Похожие материалы

2017 год объявлен годом экологии и особо охраняемых природных территорий в Российской Федерации. Министерство образования и науки рекомендует в 2017/2018 учебном году включать в программы воспитания и социализации образовательные события, приуроченные к году экологии.

Учителям 1-11 классов и воспитателям дошкольных ОУ вместе с ребятами рекомендуем принять участие в международном конкурсе «Законы экологии», приуроченном к году экологии. Участники конкурса проверят свои знания правил поведения на природе, узнают интересные факты о животных и растениях, занесённых в Красную книгу России. Все ученики будут награждены красочными наградными материалами, а учителя получат бесплатные свидетельства о подготовке участников и призёров международного конкурса.

Конкурс "Законы экологии"