Тема учебного занятия: Создание простейшего калькулятора в

Тема учебного занятия: Работа с текстом.
Класс:9А,9Б, 9В
Продолжительность учебного занятия: 45 мин.
Тип учебного занятия: изучение нового материала
Цели урока:
Образовательные:
Научиться:
 Создавать простейший калькулятор в программе Adobe Flash.
 Работать с динамическим текстом.
 Переводить текстовое значение, введенное в поле ввода в числовое
значение и наоборот.
 Создавать несколько кнопок с помощью операции дублирования.
Способствовать
 Закреплению умения работать с полем ввода (input text) и статическим
текстом.
 Закреплению навыка работы в среде Adobe Flash CS3.
Развивающие:
 Создать условия для развития познавательного интереса учащихся
 Развитие творческих способностей.
Воспитательные:
 Воспитание чувства ответственности за результат работы.
 Воспитание внимательности, дисциплинированности.
 Аккуратность при работе с компьютером
Оборудование: компьютер, проектор.
Структура урока
1) Организационный момент (3 мин)
2) Объяснение нового материала (18 мин)
3) Закрепление(20 мин)
4) Подведение итогов (2 мин)
5) Домашнее задание (2 мин)
Организационный момент
Здравствуйте, девочки. Садитесь. Давайте сначала отметим отсутствующих.
Итак, сегодня мы с вами научимся создавать свой собственный калькулятор
(Приложение 1). Он будет простым с четырьмя операциями, но дизайн его
будет таким, какой вы захотите.
Как вы видите, в ролике есть два поля ввода, в которые вы будете вводить
числа, затем четыре кнопки с операциями соответственно сложения,
вычитания, умножения и деления и динамический текст, в котором будет
отображаться результат. Внизу есть примечание, что если вы оставите поле
пустым, то кнопка считает его значение нулевым.
Объяснение нового материала
Открываем программу Adobe Flash,создаем новый документ и задаем его
размеры и цвет фона (Modify->Document), устанавливаем размер 800x600 и
предпочитаемый цвет фона.
Для начала нужно создать два текстовых поля. Для этого на панели
инструментов выбираем Text Tool, создаем текстовое поле и во вкладке
Properties выбираем input text и задаем нужные параметры (шрифт, размер
вводимого значения, расположение текста) и задаем его instance
name(например, t1)
Чтобы при запуске ролика мы видели, где находится это текстовое поле,
очертим его границы с помощь инструмента Rectangle Tool без заливки.
Также создаем второе текстовое поле. И не забудьте задать его instance name
(например,t2).
Теперь нам нужно создать четыре кнопки. Но мы создадим одну, а остальные
просто продублируем, т.е. сделаем копии с некоторыми изменениями.
На главной панели выбираем Insert->New symbol. Символ будет кнопкой
(Button), назовем plus. Рисуем кнопку и на новом слое рисуем знак плюса.
Возвращаемся на сцену и теперь чтобы создать остальные три кнопки,
заходим в библиотеку, кликаем правой кнопкой мыши по нашей кнопке plus
и выбираем в меню Duplicate. Появляется окно Duplicate Symbol, в котором
нужно задать имя новой кнопки, которая является копией кнопки plus.
Задаем ее имя (minus) и теперь нам нужно изменить в этой кнопке знак плюс
на знак минус. Для этого в режиме редактирования этой кнопки, на слое, где
мы рисовали знак плюса, нарисуем знак минус. Вот так легко можно
создавать кнопки. Проделываем такую же операцию с остальными кнопками.
Перемещаем наши готовые кнопки на сцену и задаем каждой из них название
во вкладке properties-> instance name (plus, minus,multiply и divide
соответственно).
Осталось создать текстовое поле, в котором будет выводиться результат.
Поле ввода (input text) нам уже не подходит, т.к. мы ничего вводить не будем,
статический текст нам тоже не подходит. Остается динамический текст,
который мы и будем использовать, т.к. его значение может меняться, а нам
как раз это и нужно, чтобы результат менялся в зависимости от введенных
значений. Итак, создаем динамический текст и указываем его имя (instance
name), например res.
Теперь переходим к написании кода.
Нажимаем F9, открывается окно Action Script.
Сначала опишем переменные n1 и n2, которым будет присваиваться
значение, введенное в текстовых полях t1 и t2.
var n1,n2:Number;
Затем добавляем функции для кнопки plus, т. е при нажатии на эту кнопку
будет выполняться функция plus1
plus.addEventListener(MouseEvent.CLICK,plus1);
function plus1(e:MouseEvent)
{n1=Number(t1.text);
n2=Number(t2.text);
res.text=String(n1+n2);
}
В теле функции мы присваиваем переменным n1 и n2 значения, введенные в
текстовых полях t1 и t2 соответственно. Однако, т.к. n1 и n2 числовые
переменные, необходимо перевести текстовые значения полей t1 и t2 в
числовые. Это делается с помощь функции Number.
А теперь, чтобы, наоборот, вывести результат в текстовое поле res, нужно
числовое значение, полученное в результате сложения двух чисел, перевести
в текстовое. Для этого применяем функцию String.
Аналогичный код записываем для остальных кнопок. Не забываем менять
название функций.
minus.addEventListener(MouseEvent.CLICK,minus1);
function minus1(e:MouseEvent)
{n1=Number(t1.text);
n2=Number(t2.text);
res.text=String(n1-n2);
}
multiply.addEventListener(MouseEvent.CLICK,multiply1);
function multiply1(e:MouseEvent)
{n1=Number(t1.text);
n2=Number(t2.text);
res.text=String(n1*n2);
}
divide.addEventListener(MouseEvent.CLICK,divide1);
function divide1(e:MouseEvent)
{n1=Number(t1.text);
n2=Number(t2.text);
res.text=String(n1/n2);
}
Запускаем ролик на выполнение (Ctrl+Enter).
Закрепление
Теперь попробуйте самостоятельно создать такой калькулятор.
Подведение итогов
Какую функцию мы используем для перевода текстового значения в
числовое?
А какую функцию мы используем для перевода наоборот числового значения
в текстовое?
Как мы дублируем кнопку?
Выставление оценок.
Домашнее задание.
Подготовка к итоговой контрольной работе.