Скажу сразу, что картинка может быть в любом формате – .jpg (.jpeg), .png или .gif (анимация). Я возьму вот такую анимированную картинку из интернета – корзинку с цветами.
1. Открываем русскую портативную версию программы Sothink SWF Quicker 5.3.511. Внизу должна быть открыта закладка – "Свойства".
Изменим размер сцены, выставляем размеры нашей картинки. Размер готовой флешки будет именно такой. После ввода нужных размеров не забываем нажать клавишу Enter, только тогда размер сцены изменится. Двигая ползунки, расположите рабочее поле по центру.
Если рабочее поле слишком большое, можно изменить масштаб, чтобы его было видно хорошо.
2. На "Временной шкале" создадим 4 слоя. Для этого 3 раза нажмём на значок "Вставить слой".
Переименуем слои, чтобы не путаться. Для переименования дважды щёлкнем мышкой по имени слоя, и в открывшемся окне напишем новое имя.
Назовём слои "Картинка", "Play", "Stop" и "Скрипт".
3. Импортируем наш фон-картинку в "Библиотеку".
Если картинка статичная, то импортируем её сразу. Для этого наверху в меню нажимаем на пункт "Файл" и выбираем вкладку "Импортировать в библиотеку".
Откроется окошко со списком папок на вашем компьютере. Находим нужный файл (его видно внизу в окне просмотра) и нажимаем кнопочку "Открыть".
Файл с картинкой импортировался в "Библиотеку".
Если вы случайно импортировали не тот файл, его можно удалить из "Библиотеки". Щёлкните по его названию мышкой и нажмите на клавиатуре клавишу Delete. Файл будет удалён.
Если ваша картинка анимированная, как у меня, импортировать её несколько сложнее.
Выбираем в меню пункт "Вставка" и нажимаем вкладку "Новый символ".
В открывшемся окне в поле "Имя символа" пишем слово "картинка", чтобы потом не запутаться. Выбираем тип символа – видеоролик.
Нажимаем кнопку "OK". После этого мы попадаем с основной сцены в окно редактирования вновь созданного символа – "картинка". Сюда и будем импортировать нашу анимацию. Нажимаем на кнопку "Импорт".
В открывшемся окне находим нужный файл и нажимаем кнопочку "Открыть".
Появится сообщение о том, что на Временной шкале необходимо добавить недостающие кадры.
Нажимаем кнопку "Да". Файл импортируется в "Библиотеку". Все кадры анимации появятся на "Временной шкале" и в "Библиотеке" программы. Кроме того, в "Библиотеке" будет присутствовать "Символ 2" – покадровый видеоролик анимации.
В палитре "Трансформация" для картинки настраиваем параметры – в координаты X и Yзаносим 0. Не забываем нажать клавишу Enter после введения нулей.
Теперь переходим на основную Сцену, нажав на вкладку "Сцена 1" над "Временной шкалой".
4. На основном рабочем поле "Сцена 1" выделяем первый слой "Картинка", а в палитре инструментов делаем активным инструмент "Выбор".
Щелчком мыши в "Библиотеке" выделяем импортированный файл со статичной картинкой или символ "картинка". Если у вас там много символов и символа "картинка" не видно, покрутите в "Библиотеке" полосу прокрутки справа и найдите его.
Мышкой перетягиваем его на рабочее поле слоя "Картинка".
Идём в палитру "Трансформация". Для выравнивания по центру координата X должна быть равна половине размера ширины картинки, а координата Y должна быть равна половине высоты картинки. Если размер задан нечётным числом, то значение координаты получится не целым, как у меня. Не забываем нажать клавишу Enter после выставления значений координат.
Теперь закроем замочком слой "Картинка", чтобы случайно не сдвинуть её. Щелкаем на слое "Картинка" в клеточку рядом с глазком видимости слоя. В клеточке появится замочек.
5. В качестве кнопок Play и Stop можно использовать что угодно: картинки-кнопочки, надписи (их можно сделать в фотошопе и сохранить в формате .png, или написать прямо здесь), либо встроенные в программу кнопочки.
Чтобы показать, как работать и с тем и с другим, в качестве кнопки Play я буду использовать картинку, а кнопку Stop вставлю готовую из программы.
6. Делаем активным слой "Play".
Импортируем файл с кнопкой в "Библиотеку", как в пункте 3. В меню нажимаем на пункт "Файл" и выбираем вкладку "Импортировать в библиотеку". Находим нужную картинку с кнопкой и нажимаем кнопочку "Открыть". Файл с кнопкой появится в "Библиотеке".
Если вы хотите в качестве обеих кнопок Play и Stop использовать готовые картинки, их можно импортировать одновременно.
Перетаскиваем мышкой этот файл из "Библиотеки" на слой "Play". Не забывайте, что активным должен быть инструмент "Выбор".
Кнопочка слишком большая, поэтому в палитре "Трансформация" я задам масштаб 40%. Меняя значения координат X и Y, расположим её там, где хотим. Я помещу её внизу на корзинке. Можно расположить её и на свободном от картинки месте, главное, чтобы она была на выделенном белым цветом рабочем поле. Не забудьте нажать клавишу Enter после введения всех значений в палитре "Трансформация".
Для того чтобы эта статичная картинка-кнопка могла стать элементом создаваемого плеера, её необходимо сделать символом – видеороликом. Нажмите на инструмент "Выбор", чтобы выделить кнопочку – вокруг кнопочки появится синяя обводка.
На панели "Свойства" щелкаем по надписи "Преобразовать в символ". В открывшемся диалоговом окне преобразования в символ выставляем следующие параметры. Тип символа – видеоролик, точка регистрации – посередине.
Нажимаем "OK". Внизу на панели "Свойства" для вновь созданного символа "Символ 3" в графу "Имя" вводим "play_bt".
Всё, кнопочка Play создана. Чтобы случайно не сдвинуть её, закроем слой замочком, щёлкнув на слое "Play" в клеточку рядом с глазком видимости слоя. В клеточке появится замочек.
7. Делаем активным слой "Stop".
Если в качестве кнопки Stop вы хотите использовать тоже картинку-кнопочку, делайте всё так же, как описано в пункте 6 для слоя "Play".
Я же покажу, как вставить готовую кнопку из программы. Рядом с вкладкой "Библиотека" открываем вкладку "Галерея".
В ней открываем папку "Buttons" – щёлкаем по плюсу рядом с папкой.
Здесь у нас ещё две папки. Открываем любую из них и выбираем понравившуюся кнопку. Для просмотра кнопок щёлкаем мышкой последовательно по каждой и видим в окошке просмотра, как она выглядит.
Я выбираю кнопку "stop" из папки "arrowmove". Кнопочку "play" я обычно беру из той же папки.
Перетаскиваем её мышкой на слой "Stop".
Эта кнопочка тоже слишком большая, поэтому в палитре "Трансформация" зададим масштаб. Меняя значения координат X и Y, поместим её там, где хотим. Можно расположить её поверх кнопки Play. А можно на другом месте, всё равно на флешке будет видна только одна из них. Не забудьте нажать клавишу Enter после введения всех значений в палитре "Трансформация".
Внизу, на панели "Свойства" для вновь созданного символа "Символ 4" в графу "Имя" вводим "stop_bt".
Можно закрыть слой замочком.
И последнее для этой кнопки. Все встроенные в программу кнопки звуковые. Когда вы будете нажимать их на плеере, они будут издавать звуки. Чтобы услышать какие, поводите мышкой по кнопке в окне просмотра внизу справа.
Мне эти звуки не нравятся, я их удаляю. Сделать это просто. Откройте вкладку "Библиотека". Пользуясь полосой прокрутки справа, найдите папку "stop.glb". Эта папка содержит все символы нашей кнопки. Там есть два символа со значком нотки, это и есть звуки.
Выделите каждый из этих символов мышкой и нажмите клавишу Delete.
Всё, теперь при наведении мышки на кнопку звуки издаваться не будут.
8. Делаем активным последний слой "Скрипт".
В палитре "Свойства" переходим на вкладку "Действие". Открываем эту вкладку.
Копируем и вставляем в поле следующий скрипт:
stop_bt._visible=false;
play_bt.onRelease=function()
{
myMP3 = new Sound();
myMP3.loadSound(mp3, true);
play_bt._visible=false;
stop_bt._visible=true;
};
stop_bt.onRelease=function()
{
play_bt._visible=true;
stop_bt._visible=false;
myMP3.stop();
};
Производим проверку скрипта на наличие ошибок, нажав на зелёную галочку над ним.
Если скрипт написан правильно, появляется такое сообщение:
9. Закрываем это окно и тестируем сам ролик, нажав на кнопку "Предварительный просмотр" (зелёный треугольник).
В открывшемся окне просмотра вначале на картинке должна быть видна кнопка Play.
Нажимаем на неё, появляется кнопка Stop.
Нажмите на кнопку Stop, должна появиться кнопка Play. Если кнопки меняются при нажатии, значит у вас всё верно. Закрываем окно просмотра.
10. Сохраняем наш проект – нажимаем на пункт "Файл" и выбираем вкладку "Сохранить", или просто нажимаем Ctrl+S. Задайте проекту имя и сохраните его. Вы всегда сможете открыть его и отредактировать, если вас что-то не устроит.
Сохраняем флешку-плеер в формате .swf (формат флеш) на компьютер. Нажимаем кнопочку "Экспорт".
В названии флешки должны быть только латинские буквы.
Размещаем флешку-плеер в интернете. Я люблю заливать плееры на ЯП
Здесь вы получите уже готовый код для Лиру.
Можно поместить плеер в черновик своего дневника и потом посмотреть код. Но тогда вам придётся самостоятельно подставить размеры плеера в код.
К готовому плееру можно подгружать любую музыку в формате .mp3.
Формула для размещения плеера с музыкой на страничке Лиру выглядит следующим образом:
[flash=ширина_флешки,высота_флешки,http://(Ссылка_на_плеер).swf?
mp3=http://(Ссылка_на_музыку)]
У меня из картинки получился вот такой плеер:
Пуговка с тр-ом на картинке
Комментариев нет:
Отправить комментарий