Динамическое меню. Вопросы к экзамену
Конструктор меню
Для создания и изменения меню в процессе разработки приложения в среде Delphi предназначен Конструктор меню (Menu Designer). Запуск Конструктора меню можно выполнить по команде Menu Designer (Конструктор меню) контекстного меню компонента MainMenu или PopupMenu, а также с помощью двойного щелчка мыши на этих же компонентах. Предварительно один из этих компонентов следует добавить на форму. Напомним, что компоненты MainMenu и PopupMenu размещаются на странице Standard (Стандартная) Палитры компонентов.
Конструктор меню похож на текстовый редактор и предоставляет возможность достаточно просто и удобно конструировать меню любого типа. Меню при конструировании имеет тот же вид, что и при выполнении приложения. Вид меню при конструировании с помощью Конструктора меню показан на рис. 7.4.При работе с Конструктором меню используются команды его контекстного меню (рис. 7.4), вызываемого щелчком правой кнопкой мыши при размещении указателя в области Конструктора меню. С их помощью можно выполнить такие действия, как добавление (Insert) и удаление (Delete) пункта меню, создание подменю (Create Submenu), выбор меню (Select Menu).
При конструировании меню можно также перемещать указателем мыши пункты меню и подменю по технологии drag-and-drop. Используемый совместно с Конструктором меню Инспектор объектов позволяет управлять свойствами отдельных пунктов меню. В частности, наименование пункта меню задается путем присвоения нужного значения его свойству caption.
С помощью Конструктора создание и настройка меню ведется при создании приложения. Кроме того, меню можно создавать или изменять динамически непосредственно при выполнении приложения. Например, возможно:
- создать новое меню любого типа или удалить его;
- заблокировать или разблокировать отдельные пункты;
- сделать пункт меню видимым или невидимым;
- добавить или удалить пункт меню;
- изменить название пункта;
- установить или убрать отметку пункта;
- переключить форму с одного главного меню на другое.
Эти возможности обеспечиваются установкой свойствам пунктов меню требуемых значений и вызовом соответствующих методов.
Для добавления пунктов меню используются методы Add и insert, для удаления пунктов меню используется метод Delete.
Процедура Add (item: TMenuitem) добавляет определяемый параметром item элемент в конец подменю, которое вызвало этот метод. Если подменю не существовало, то оно создается.
Пример. Добавление пункта меню.
procedure Forml.mnuItemAddClick(Sender:TSender);
var Newltem: TMenuitem;
NewItem:= TMenuitem.Create(Self);
NewItem.Caption:= "Новый элемент";
mnuFile.Add(NewItem);
end;Добавление нового пункта производится в конец списка команд меню Файл. Добавляемый пункт имеет заголовок Новый элемент. Предварительно новый пункт создается конструктором Create.
Процедура Insert (Index: Integer; Item: TMenuItem) , в отличие от предыдущего метода, добавляет новый пункт меню на указанное положение. Параметр index определяет позицию в массиве элементов меню, на которую вставляется новый пункт. Если значение параметра index выходит за пределы допустимого диапазона, например, больше, чем число подэлементов модифицируемого пункта меню, то возникает исключительная ситуация.
Процедура Delete (index: integer) удаляет указанный пункт меню. Если удаляемый пункт имеет подпункты, то они также удаляются.
Пример. Удаление пункта меню.
procedure Forml.mnuItemDeleteClick(Sender:TSender);
if mnuFile.Items.Caption = "Второй элемент"
then mnuFile.Delete(2); end;
Процедура выполняет удаление пункта из подменю Файл. Удаляемый пункт имеет заголовок Второй элемент и находится на второй позиции. Предварительно производится проверка, действительно ли удаляется пункт с нужным названием.
Форма может иметь более одного главного меню. Это используется, например, в случае, когда одно из них содержит заголовки на английском языке, а другое - на русском. Для реализации такой возможности на форму следует поместить два компонента MainMenu и подготовить соответствующие меню. После этого при выполнении программы возможно подключение к форме любого из этих меню. Для подключения к форме главного меню используется свойство Menu формы.
Пример. Переключение между двумя главными меню.
if Forml.Menu = EnglishMenu
then Forml.Menu:= RussianMenu else Forml.Menu:= EnglishMenu;
Меню имеют названия EnglishMenu и RussianMenu. Код, выполняющий переключение меню, может быть включен в соответствующий обработчик.
Напомним, что Menu является одним из свойств формы, указывающим на главное меню, которое в настоящий момент является активным.
Вопросы к экзамену
обновлено: 17.0 8.1 2
1. Понятие, основные функции, типы операционных систем.
2. Функции операционной системы.
3. Операционное окружение.
5. Машинно-зависимые свойства операционных систем.
6. В чем состоит назначение файловой системы ОС?
7. Что такое файл? Какие структуры файлов поддерживаются различными ОС?
8. Что такое каталог (директорий)? Для чего каталоги служат?
9. Какие операции над файлами обеспечиваются операционными системами?
10. Охарактеризуйте команды операционной системы MS DOS.
11. Опишите интерфейс оболочки ОС Norton Commander.
12. Охарактеризуйте стиль работы с помощью оболочки Windows.
13. По каким показателям Windows"95 превосходит Windows 3.11?
14. Сопровождение операционных систем.
15. Какие функции выполняют меню Пуск? Поиск?
16. Как вызвать динамическое меню, и каковы его возможности?
17. Какие события в развитии технической базы вычислительных машин стали вехами в истории операционных систем?
18. В чем состояло принципиальное отличие первых мониторов пакетной обработки от уже существовавших к этому времени системных обрабатывающих программ? трансляторов, загрузчиков, компоновщиков, библиотек процедур?
19. Машинно-независимые свойства операционных систем.
20. Как эволюционировало отношение к концепции мультипрограммирования на протяжении всей истории ОС?
21. Защищенность и отказоустойчивость операционных систем.
22. Чем объясняется особое место ОС UNIX в истории операционных систем?
23. Опишите историю сетевых ОС.
24. В чем состоят современные тенденции развития ОС?
25. Поясните определение операционной системы как расширенной машины.
26. В соответствии с определением ОС ее главными функциями являются предоставление удобств пользователю и эффективное управление ресурсами компьютера. Какая их этих двух функций должна была доминировать в мультипрограммных ОС времен IBM/360? А в первых ОС для персональных компьютеров?
27. В чем состоит отличие в виртуальных машинах, предоставляемых операционной системой простому пользователю и прикладному программисту?
28. Сравните интерфейс прикладного программиста с операционной системой и интерфейс системного программиста с реальной аппаратурой. Что можно сказать о разнообразии и мощности интерфейсных функций, имеющихся в распоряжении каждого из них?
29. Назовите абстрактно сформулированные задачи ОС по управлению любым типом ресурса. Конкретизируйте эти задачи применительно к процессору, памяти, внешним устройствам.
30. Вставьте пропущенные определения: ?Пользователю... ОС не требуется знать, на каком из компьютеров сети хранятся файлы, с которыми он работает, а пользователю... ОС эти сведения обычно необходимы?.
31. Стандартные программы операционной системы.
32. Какой минимум функциональных возможностей надо добавить к локальной ОС, чтобы она стала сетевой?
33. Перечислите основные сетевые службы. Какие из них, как правило, встроены в операционную систему?
34. Поддержка приложений других операционных систем, способы организации поддержки устройств, драйверы оборудования, понятие, функции и способы использования программного интерфейса операционной системы.
35. Поясните значение следующих терминов применительно к сетевым ОС: ?сервис?, ?сервер?, ?клиент?, ?служба?, ?оболочка?, ?услуга?, ?редиректор?. Какие из них употребляются как синонимы?
36. Может ли сетевая оболочка работать над сетевой ОС?
37. В каких случаях может оказаться полезным наличие сразу нескольких серверных (клиентских) частей файловых служб?
38. Виды пользовательского интерфейса.
39. Может ли выделенный сервер обращаться с запросами к ресурсам клиентских станций?
40. Приведите примеры одноранговых ОС и ОС с выделенным сервером.
41. Какие из приведенных ниже терминов являются синонимами? О привилегированный режим;
О защищенный режим; О режим супервизора; О пользовательский режим; О реальный режим; О режим ядра.
42. Можно ли, анализируя двоичный код программы, сделать вывод о невозможности ее выполнения в пользовательском режиме?
43. В чем состоят отличия в работе процессора в привилегированном и пользовательском режимах?
44. В идеале микроядерная архитектура ОС требует размещения в микроядре только тех компонентов ОС, которые не могут выполняться в пользовательском режиме. Что заставляет разработчиков операционных систем отходить от этого принципа и расширять ядро за счет перенесения в него функций, которые могли бы быть реализованы в виде процессов-серверов?
45. Какие этапы включает разработка варианта мобильной ОС для новой аппаратной платформы?
46.Опишите порядок взаимодействия приложений с ОС, имеющей микроядерную архитектуру.
47. Какими этапами отличается выполнение системного вызова в микроядерной ОС и ОС с монолитным ядром?
48. Может ли программа, эмулируемая на?чужом? процессоре, выполняться быстрее, чем на? родном??
49. Файловая структура MS DOS.
50. Виды пользовательского интерфейса MS DOS.
51. Понятие, функции и способы использования программного интерфейса операционной системы MS DOS.
52. Средства управления и обслуживания. Установка и сопровождение операционных систем.
Наверняка вы видели на некоторых веб-сайтах динамичные и анимированные меню, которые изменяются при прокрутке вниз. Минимизируя главное меню навигации, вы оставляете больше места для содержания. В этом уроке мы объясним, как вы можете создать меню самостоятельно с помощью HTML5, CSS3 и немного jQuery.
Если вы хотите, чтобы особое внимание фокусировалось на содержании сайта, а также позволяло создавать более крупную и впечатляющую навигацию при первом посещении пользователем веб-сайта, то такого рода меню вам подойдет как нельзя лучше. Вы можете отлично продемонстрировать свой бренд или логотип, и после первоначального ознакомления с сайтом, уменьшить некоторые элементы, что позволит пользователю обратить главное внимание на ваше содержание.
Есть несколько способов это сделать. В этом уроке мы объясним, как создать фиксированное меню во всю ширину страницы, которое изменяется в высоте вместе с логотипом, создавая сведенную к минимуму версию исходного оригинала. При желании, вы также можете заменить логотип на другой вариант, например инициалы или иконку, но имейте в виду, что консистенция очень важна здесь, так чтобы пользователь понимал, как элемент изменился и что его главная цель по-прежнему является навигация по сайту.
Создание базовой структуры в HTML5
Мы начнем с создания основного HTML кода, который нам понадобится. Для начала, мы будем придерживаться очень простой структуры HTML5.
Теперь, когда наш первоначальный HTML код написан, мы добавим код для меню, а также некоторые другие детали для хедера нашего HTML файла.
Как создать анимированное меню | WebDesignMagazine
- Главная
- Статьи
- Это очень клевый сайт!
Крутим вниз и смотрим как изменится меню
Все! Приехали!
В нашем : мы добавили мета-тег для автора, чтобы указать создателя документа, после чего мы включили известный “сброс CSS” от Эрика Мейера, что приведет к сбросу почти каждого элемента в HTML файле, давая вам более понятный и простой документ для работы. И так как мы будем использовать JQuery позже, в последней строке нашего главного элемента мы импортируем его через JQuery CDN.
В нашем теге, мы использовали по умолчанию HTML5 элемента. Наш будет во всю ширину страницы и будет нести ответственность за изменения между большими и малыми версии меню. Мы даем нашему класс с именем “large”, так чтобы мы могли изменить некоторые специфические свойства в CSS, чтобы преврать наше меню в уменьшенную версию. это наш меню-контейнер, который содержит изображение логотипа нашего веб-сайта и простой неупорядоченный список меню с тремя ссылками.
Поскольку у нас здесь нету никакого контента, будет использоваться, чтобы растянуть страницу и заставить действовать прокрутку.
И это все по HTML части. Теперь нам нужно стилизовать элементы при помощи CSS и сделать меню динамичным.
Стилизация меню и страниц
/* Импортируем шрифт Amaranth */ @import url(//fonts.googleapis.com/css?family=Amaranth); /* Основной стиль */ body{ background-color: #ebebeb; } ul{ float: right; } li{ display: inline; float: left;} img.logo{float: left;} /* Размер и центровка меню */ nav{ width: 960px; margin: 0 auto;}
Немного этого CSS сделает наше меню 960px шириной по центру, при организации нашего меню справа и логотипа слева. Мы также импортируем Amaranth шрифт от Google Web Fonts, чтобы использовать его для нашего текста на странице.
Section.stretch{ float: left; height: 1500px; width: 100%; } section.stretch p{ font-family: "Amaranth", sans-serif; font-size: 30px; color: #969696; text-align: center; position: relative; margin-top: 250px; } section.stretch p.bottom{ top: 100%; }
Здесь мы просто заставляем страницу растянуться, чтобы спровоцировать скроллинг (прокрутку), и позиционирование текста для обозначения начала и конца содержания.
Header{ background: #C7C7C7; border-bottom: 1px solid #aaaaaa; float: left; width: 100%; position: fixed; z-index: 10; } header a{ color: #969696; text-decoration: none; font-family: "Amaranth", sans-serif; text-transform: uppercase; font-size: 1em; } header a.active, header a:hover{ color: #3d3d3d; } header li{ margin-right: 30px; } /* Размеры для увеличенного меню */ header.large{ height: 120px; } header.large img{ width: 489px; height: 113px; } header.large li{ margin-top: 45px; }
Здесь мы заканчиваем основную стилизацию нашего заголовка. будет служить нашим меню контейнером. Он будет содержать наш элемент и будет служить элементом, где мы определяем цвет фона, высоту меню, стиль меню ссылок и другое. Он будет адаптироваться к ширине экрана со свойствами ширины: 100% и будет оставаться фиксированными в течение других элементов на веб-сайте. Важно не забуть задать z-индекс, чтобы этот элемент перекрывал остальные части страницы, а также положения:fixed, чтобы сделать div закрепленным вверху, так чтобы он оставался на том же положении, в то время как пользователь прокручивает веб-сайт. Как вы видите, кроме установки стилей для заголовков, мы также устанавливаем некоторые специфические стили для “large” класса, используя header.large. Начальное состояние нашего меню будет большим, и поэтому мы здесь определяем только нужные стили, чтобы оно выглядело, как мы хотим, при первоначальном входе пользователя на страницу.
Динамическое изменение размера меню
Наше меню сделано и стилизовано, но мы все еще хотим поработать над его минимизацией. Для создания этого «состояния», мы будем создавать новый класс для в CSS под названием “small”, который будет ответствен за изменение свойств, которые мы должны модифицировать. Мы уже определили большое меню, так что теперь мы просто должны сделать наше меню короче, наше изображение меньшего пропорционального размера, а (margin top) мы используем в наших элементах
/* Sizes for the smaller menu */ header.small{ height: 50px; } header.small img{ width: 287px; height: 69px; margin-top: -10px; } header.small li{ margin-top: 17px; }
Итак, как вы видите, эти стили практически идентичны тем, которые в большей меню, мы просто изменили класс “large” на “small” и изменили значения, которые мы использовали, на меньшие. Мы используем отрицательные марджин-топ на изображение, чтобы централизовать его в контейнере, так как изображение имеет тонкую тень и выше, чем написание для его приспособления. Теперь у нас есть все необходимые стили, чтобы настроить меню размера изменения, и если вы попытаетесь изменить его в вашем , вы увидите в браузере, что меню станет меньше. Но нам нужно, чтоб оно было динамичным.
Изменение класса меню при помощи jQuery
При всех наших стилях на местах, нам просто нужно добавить немного JavaScript, чтобы переключатся между классами «large» и «small». Так как мы хотим изменить это на основе прокрутки пользователем, мы будем использовать.ScrollTop () функцию в jQuery. Эта функция позволит нам получить или установить позицию прокрутки в пикселях. Положение прокрутки является количеством пикселей, которые уже были прокручены в окне браузера. В этом случае мы просто должны знать сколько пикселей пользователь прокрутил, чтобы мы могли вызвать наш код и переключиться между классами:
$(document).on("scroll",function(){ if($(document).scrollTop()>100){ $("header").removeClass("large").addClass("small"); } else{ $("header").removeClass("small").addClass("large"); } });
Если пользователь прокрутил более 100 пикселей, то тогда будет удален класс «large», который мы создали, и добавлен наш новый класс «small». Таким образом, меню будет изменяться в размере, как мы ранее определили в CSS. Попробуйте, к этому времени оно должно уже работать, но вы могли заметить, что переходы между классами, кажутся очень резкими.
CSS переходы для анимации меню
Для того, чтобы гладко переключаться между классами в нашем меню, мы будем использовать CSS переходы. Просто используйте этот кусок кода рядом с остальной частью вашего CSS.
Header,nav, a, img, li{ transition: all 1s; -moz-transition: all 1s; /* Firefox 4 */ -webkit-transition: all 1s; /* Safari and Chrome */ -o-transition: all 1s; /* Opera */ }
Здесь мы определили переходы для всех свойств CSS для , и
Не все шаблоны предлагают возможность использования встроенного в них динамического меню, когда при наведении на пункт меню курсора мыши скрытые подменю раскрываются выпадающим списком. Статические меню могут быть, конечно, самодостаточными, при условии, если структура вашего сайта состоит всего из нескольких разделов. Но такое характерно только для сайтов-визиток. Как правило, уважающий себя сайт имеет достаточно разветвленную структуру, что само по себе заставляет прибегать к раскрывающимся меню, поскольку ширина или высота веб-страницы не бесконечны и не смогут разместить все пункты в одну строку (случай горизонтального положения меню) или в один столбец (случай вертикального меню). Кроме того, замечено, что пользователи очень не уважают меню, в которых больше 5-10 пунктов, для них становится утомительным вчитываться в бесконечный перечень пунктов меню сайта, они уходят с него, даже не дойдя до последнего пункта, даже, быть может, как раз того, что искали на вашем сайте. Поэтому необходимость динамического меню очень серьезно мотивирована. Существует специальное расширение, которое инсталлируется в вашу Joomla и позволяет в режиме конструктора вам самим создать и оформить меню по своему усмотрению. Но даже если вам не нужно динамическое меню, вам вполне достаточно статического, или выбранный вами шаблон сайта уже имеет таковое, не спешите игнорировать эту тему. Она в любом случае позволит вам лучше понимать специфику веб-приложений, когда вы сами поработаете в программе Swmenufree.
Com_swmenufree5.2_J1.5Именно так называется плагин, который мы скачиваем отсюда и устанавливаем уже известным нам способом на своем сайте. После установки в меню «Компоненты» выбираем «SwMenuFree» и переходим в панель управления этой программы. Перед нами окно с множеством настроек и вкладками «Параметры модуля», «Размеры и положение», «Цвет и фон», «Шрифты и отступы», «Границы и эффекты». Особо не стоит пугаться обилия настраиваемых параметров, но оговоримся сразу: работа предстоит творческая.
В строке «Имя модуля» мы сразу вводим название меню, которое собираемся создать. Это название важно для системы, а не для нас, поскольку после его создания меню с таким именем вы все равно не увидите в списке меню вашего сайта. Дело в том, что мы не создаем новое меню как таковое, а преобразуем содержимое любого, по выбору, из уже созданных в новый, динамический вариант. Мы для ясности использовали название «Динамическое меню».
В строке «Источник меню» выбираем «Trans Menu», так как этот вариант, из всех трех возможных, самый оптимальный для нашего шаблона. Кто не верит, пусть попробует остальные, чтобы в результате согласиться с нашей версией.
Строка «Источник меню» позволяет нам выбрать из списка то, уже существующее меню сайта, которое мы хотим представить в динамическом виде. Собственно, выбор не велик, ведь у нас пока всего одно меню – Главное, с системным именем mainmenu. Его-то в этом списке и выбираем.
В строке «Родитель» оставляем значение TOP. Это означает, что наше меню не является дочерней веткой, а само выступает в качестве родителя, способного «порождать» другие ветки меню.
Спускаемся в следующий блок настроек – «Параметры таблицы стилей». В строке «Загрузка таблицы» выбираем «Внедрить стиль напрямую в страницу», это позволит нашему меню использовать именно те стили оформления, которые мы сами ему зададим, игнорируя навязываемые шаблоном сайта стили.
В строке «Суффикс класса модуля» ничего не пишем.
Следующий блок «Параметры кэширования» игнорируем.
Блок «Общие параметры модуля». Проставляем флажки так, как показано на рисунке.
Блок «Размещение и доступ». В строке «Размещение модуля» ставим header1 (это положение горизонтального меню предусмотрено для данного шаблона. Кстати, у нас на данный момент там стоит модуль поиска по сайту, поэтому вам нужно будет предварительно переключить его в другую позицию - banner).
Другие настройки в этой вкладке не трогаем, пока у нас на сайте всего одно меню, они не актуальны, и значения, по умолчанию выставленные в них, нас вполне удовлетворяют. Хотя, если вы желаете, чтобы ваше главное меню отображалось не на всех страницах сайта, а только на нескольких, - выберите в блоке «Отображение модуля меню на страницах» нужное.
Переходим в следующую вкладку – «Размеры и положение». Здесь мы сможем настроить высоту, ширину элементов меню и подменю, а также способ расположения на странице.
Блок «Положение и ориентация меню». В строке «Меню - Выравнивание:» ставим left, т.к. выравнивание текста меню по левому краю считается оптимальным. В строке «Меню / Подменю - Ориентация:» выбираем horizontal/down/right (горизонтально-вниз-вправо). Не забываем после каждого внесенного изменения в настройки нажимать кнопку «Просмотр». После чего вы увидите ваше меню в отдельном окне, в котором оно функционирует и выглядит так, как будет выглядеть на странице после сохранения результатов. Полюбовавшись, можно закрыть это окно.
Блок «Размеры элементов меню». Здесь все значения равны нулю, что означает размер элементов меню по размеру содержащегося в нем текста. Это очень удачный для нас вариант, т.к. мы создаем горизонтальное меню, а в нем, в отличие от вертикального, все элементы не должны быть одного размера.
В блоках «Смещения меню верхнего уровня» и «Смещения подменю» можно задать величину смещения элементов меню относительно друг друга. Хотя в этом нет особой объективной необходимости.
Вкладка «Цвет и фон». Здесь начинается самое интересное. Здесь мы должны проявить максимум творческого подхода, оформив все элементы нашего меню в гармонирующие с фоном шаблона сайта цвета. Фон элементов меню можно заливать цветом и изображениями (вспоминаем PowerPoint!). Причем заливка изображением имеет доминирующее значение над заливкой цветом: если вы зальете обоими вариантами, результирующей окажется заливка изображением. Так как у нас нет никаких изображений, блок «Фоновые изображения» пока пропускаем. А в блоке «Цвет фона» начинаем работать. Чуть ниже находится палитра выбора цветов и подсказка, как это сделать: «Выберите цвет на палитре и нажмите кнопку выбор около поля, к которому вы хотите применить выбранный цвет».
Не забываем всякий раз просматривать результат. Какие цвета выбрать, смотрите сами, но все же лучше будет после просмотра в отдельном окне нажать кнопку «Сохранить» и перейти на главную страницу сайта (если вы работаете с сайтом в двух вкладках – главная страница и админпанель – как мы предлагали изначально, то не составит трудности переключиться на соседнюю вкладку браузера), чтобы воочию увидеть соответствие выбранного цвета фону шаблона сайта.
Но мы не можем использовать всех возможностей.
Изменение структуры менюВо-первых, перейдя на главную страницу, мы видим, что у нас два главных меню: одно – новое, над которым мы сейчас работаем, а другое – старое, которое стоит в своей позиции в правой части страницы. Не удивляйтесь, чтобы меню не дублировались, одно из них надо отключить, а именно старое, точнее, отключить модуль его отображения. Идем в «Расширения» - «Модули» и отключаем модуль «Главное меню», щелкнув по зеленой галке в его строке, превратив её в красный круг с белым крестом. Переходим на вкладку, в которой открыта главная страница и видим, осталось одно меню.
Во-вторых, мы не можем настроить оформление подменю, поскольку у нас пока их нет. Поэтому нам нужно перестроить структуру нашего меню так, чтобы основные элементы стали подпунктами.
Для этого идем в меню настройки: «Меню» - «Главное меню». Перед нами список основных элементов меню. Давайте два из них оставим основными, а остальные переведем в разряд подменю. Нам нужно будет последовательно открывать каждое из «приговоренных» к роли подменю основных элементов меню и в строке «Родительский пункт меню» щелкнуть тот элемент, чьим подменю мы делаем данный элемент. На рисунке показан уже результат пяти последовательных выборов для каждого элемента (бывшие основные элементы «Форум», «Галерея», «Загрузка», «Блог категории», «Демонстрация», чьим родительским элементом раньше являлся невидимый пункт «Вверху», стали «детьми» основного пункта «Возможности»).
Чтобы лучше понять механизм этих изменений, рекомендую после каждогоизменения статуса элемента меню и его сохранения выходить на главную страницу, нажимать F5 и смотреть на результат. Двух-трех раз, думаю, будет достаточно. Можно пойти даже далее и еще усложнить меню, например, сделав родителем двух последних элементов подпункт «Загрузка». В результате мы будем иметь трехуровневую иерархию в своем меню.
Количество уровней, которые можно создать подобным образом – не ограничено, но больше трех уровней делать не рекомендуется.
Теперь возвращаемся в панель управления SwMenuFree и донастраиваем оставшиеся элементы подменю, а также цвет шрифта и цвет границ в соответствующих одноименных блоках вкладки «Цвет и фон». Следует пояснить, что цвет меню, подменю и шрифта устанавливается для двух вариантов: вне курсора и когда на подпункт (пункт и его содержимое) наведен курсор мыши. Эти цвета, разумеется, должны различаться.
Вкладка «Шрифты и отступы». Здесь можно выбрать вид шрифта и отступы от границы ячейки меню до текста этой ячейки. Рекомендую здесь ничего не менять, кроме толщины шрифта, поскольку обычное начертание сливается подчас с фоном заливки (в блоке «Плотность шрифта» выбираем bold).
Вкладка «Границы и эффекты». На рисунке указаны наши настройки.
Жмем сохранить. Меню готово. Вам больше не нужно заходить в панель управления SwMenuFree, разве что если вы решите поменять цвет оформления при текущем шаблоне или при смене шаблона сайта, т.к. при этом настройки оформления меню не сохраняются.
Но мы еще не рассмотрели возможность заливки фона рисунком.
Заливка фона меню рисункомЭтот способ сложнее, но возможности оформления дает неограниченные. Для создания изображений мы воспользуемся GIMP (помнится, в 5 занятии мы с его помощью создавали логотип сайта, вернее, пытались создать).
Нам нужно создать прозрачное изображение размером 200 ×200px. «Файл» - «Создать».
Настройки диалогового окна, как на рисунке. Теперь берем инструмент «Прямоугольное выделение» (нажимаем клавишу R) и рисуем на нашем прозрачном изображении рамку выделения шириной пикселей 100 и высотой 25 пикселей. В панели инструменов, в строке «Размер», при перемещении мыши вы видите изменяющиеся цифры высоты и ширины создаваемого выделения, в зависимости от этих значений мы и направляем нашу мышку в ту или иную сторону, пока значения не будут равны 100 и 25 пикселей соответственно. Получившееся выделение мы должны залить темно-коричневым цветом, воспользовавшись инструментом «Плоская заливка» (Shift+B) и выбрав нужный цвет в палитре. Палитра вызывается на экран щелчком по прямоугольнику цвета переднего плана в панели инструментов. (Вообще все кнопки панели обладают подсказками, достаточно задержать курсор на каком-либо значимом элементе панели – тут же выскакивает подсказка).
В палитре нужно щелкнуть курсором в подходящий цвет и согласиться с выбором. После этого щелкаем внутри выделения – и оно заливается выбранным цветом.
Теперь нам нужно выделить полоску толщиной 3 пикселя по нижнему краю нашей заливки. Мы делаем это, как только что выделяли первую область, ориентируясь на цифры в панели инструментов (в строке «Размер»). Если вы уже отпустили курсор, а цифры все не те, скажем, больше или меньше нужных, подводим курсор к границе выделения. Как только он меняет форму, придавливаем левую кнопку мыши и тащим курсор вниз или вверх. Отпустив мышь, видим, что таким образом мы увеличили или уменьшили область выделения. Пробуем еще раз, доведя область выделения до нужных нам размеров. Заливаем её оранжевым цветом.
Теперь делаем слой частично прозрачным: меню «Окна» - «Панели» - «Слои». В появившейся панели видим прямоугольник текущего слоя, выделяем его щелчком и перемещаем ползунок в строке «Непрозрачность» так, чтобы значение стало равным 80. Наша заливка стала немного прозрачной. Теперь из всей этой заливки нам нужно вырезать тонкую полоску высотой 25 пикселей и шириной 3 пикселя. Берем инструмент «Кадрирование» и, как до этого инструментом выделения, охватываем нужный прямоугольник, опять же ориентируясь на размеры в панели. Если промахнулись, исправляем ошибку, так же, как и с выделением, в плане исправления погрешностей это идентичные инструменты. (Для работы с мелкими объектами лучше увеличить масштаб изображения до 200-400%. Выпадающий список с возможными размерами масштаба – в строке состояния окна с изображением, промахнуться трудно.) После того, как нужные размеры достигнуты, щелкаем внутри выделенного прямоугольника и получаем наше первое готовое изображение для кнопки меню. Не удивляйтесь, что оно такое маленькое, браузер повторит его столько раз, сколько нужно для заполнения всей площади кнопки. Сохраняем его в формате.png на Рабочем столе под именем а2.
Создаем еще одно прямоугольное изображение 25 на 3 пикселя, только залитое сплошным коричневым цветом, тем же, что и первое. Сохраняем его под именем a1.png.
Идем в админку сайта, запускаем SwMenuFree. Вкладка «Цвет и фон». Блок «Фоновые изображения». Строка «Меню - фон:», кнопка «Выбор». Нам нужно теперь загрузить наши изображения на сайт. В появившемся окне жмем кнопку «Обзор». Указываем наш рисунок a1.png на Рабочем столе и жмем кнопку Upload. Он загружается в папку на сайте. Чтобы вставить его в качестве фона пункта меню, щелкаем прямо по загруженному на сайт изображению и жмем OK. То же самое, но только в строке «Меню - фон при наведении:» проделываем с изображением a2.png.
Если все сделали правильно, получилось очень оригинальное меню: в спокойном состоянии меню однотонное, а при наведении курсора в нижней части элемента меню появляется оранжевая полоса. Когда быстро ведешь по меню мышкой, эта полоса стремительно пробегает по всему меню.
Контрольные вопросы:По имени файла или папки и по цепочке символов, входящих в имя файла или папки;
По расширению имени файла;
По дате последней модификации;
По размеру;
По отрывку текста из документа или по заголовку какого-либо раздела.
Использование различных вкладок облегчает поиск файлов по определенным критериям.
Для быстрого вызова часто повторяемых команд можно воспользоваться динамическим меню, которое вызывается правой кнопкой мыши. Динамическое меню (рис. 2.8) содержит часто употребляемые команды. Набор команд зависит от выбранного объекта: значка диска, папки или файла, выделенного текста, панели задач или свободного места экрана.
Если щелкнуть правой кнопкой значок диска в окне программы Мой компьютер, то появятся команды: Открыть, Проводник, Найти, Разделение, Форматировать, Вставить, Создать ярлык. Свойства. Так же как и для диска, команды динамического меню для файла зависят от типа файла и дублируют меню Файл. Правую кнопку мыши удобно использовать для перемещения или копирования файла из одного окна в другое папки Мой компьютер или Проводник. После транспонирования значка папки/файла с нажатой правой кнопкой мыши появляется динамическое меню, позволяющее указать цель транспортировки: переместить или скопировать объект, создать значок быстрого вызова.
Папка Мусорная корзина предназначена для удаления ненужных файлов. Основное различие между выполнением команды Удалить в Windows"95 и в других программах состоит в том, что в новой версии операционной системы выбор команды приводит не к удалению файла, а к его перемещению в папку Мусорная корзина. Попавший в нее файл сохраняется до тех пор пока Корзина не будет «очищена». Чтобы удалить любой файл, папку или значок быстрого вызова, можно использовать команду Удалить или переместить значок удаляемого объекта мышью на значок Мусорная корзина. Значок перетаскиваемого объекта исчезнет. Чтобы просмотреть все файлы, находящиеся в Мусорной корзине, необходимо дважды щелкнуть ее значок. Появится окно папки со строкой меню, имеющим стандартный набор команд. Для восстановления файла, папки или значка быстрого вызова необходимо щелкнуть имя восстанавливаемого файла. Если надо восстановить несколько файлов, то имена файлов выделяют при нажатой клавише Ctrl. Затем используют команду Восстановить из меню Файл.
Рис. 2.8. Динамическое меню
В настоящее время для IBM PC-совместимых компьютеров выпускаются тысячи наименований винчестеров, адаптеров, контроллеров и других изделий. В ряде случаев их установка на компьютере вызывает значительные трудности с точки зрения совместимости, требует больших затрат времени пользователя для выбора положения перемычек. Компьютеры с Plug and Play -адаптерами не нуждаются в ручной установке DIP-переключателей. В соответствии с технологией Plug and Play после включения компьютера автоматически определяются названия вновь подключенных устройств или плат и их характеристики, выполняется их конфигурирование и автоматически загружаются соответствующие драйверы. Это может происходить и во время сеанса работы в случае изменения аппаратных средств компьютера. Аналогично фиксируется удаление какого-либо устройства или платы, выгружаются драйверы этого устройства с тем, чтобы они не занимали оперативную память и освободили системные ресурсы.
При инсталляции Windows"95 приложение Setup (Установка) определяет адаптеры и драйверы, которые не поддерживают новую технологию, и автоматически делает соответствующие записи в системных файлах. Даже если ваш компьютер не полностью поддерживает стандарт Plug and Play, Windows"95 поможет настроить аппаратное обеспечение с помощью диалогового окна Свойства с вкладкой Ресурсы рассматриваемого устройства. Для вызова окна Устройства сначала следует активизировать значок Система Панели Управления и двойным щелчком мыши выбрать устройство. В нижнем поле Список конфликтующих устройств указываются устройства, с которыми может конфликтовать рассматриваемое устройство. Рекомендуется установить флажок Использовать автоматическую настройку, чтобы операционная система сама производила настройку системных ресурсов.
Технология Plug and Play содержит три основных компонента: операционную систему, поддерживающую Plug and Play, Plug and Play BIOS и Plug and Play - устройства с соответствующими драйверами. Поэтому полное решение проблемы Plug and Play требует поддержки как на программном, так и на аппаратном уровнях.
В ходе работы с Windows"95 иногда приходится производить перезагрузку системы. Различают «холодную» и «горячую» перезагрузку компьютера. «Холодная» перезагрузка выполняется после выключения питания и его повторного включения. Необходимые для работы программы и параметры считываются в оперативную память заново. «Горячая» перезагрузка производится без выключения питания, одновременным нажатием клавиш Alt+Ctri+Del. В этом случае вся информация, хранящаяся в оперативной памяти и не записанная на жесткий диск, стирается. «Горячую» перезагрузку, как правило, используют в том случае, когда программа «зависла» и не реагирует на нажатие на клавиши и на кнопки мыши. В ряде случаев при нажатии на клавиши Alt+Ctri+Del появляется диалоговое окно Снять Задачу. Если окно позволит закрыть «зависшую» программу, то необходимость в перезагрузке компьютера отпадет.
Перед тем как выключать питание компьютера, необходимо закрыть все открытые документы и приложения. Выключение питания без закрытия документа может привести к потере данных, повреждению открытых файлов и трудностям с их открытием при последующих сеансах работы. После выключения компьютера без правильного выхода из системы возможны нарушения в логической структуре диска. Их исправить можно с помощью программы ScanDisk, расположенной в группе Служебные программы.
Для корректного выхода из Windows надо щелкнуть кнопку Пуск и команду Завершить работу в появившемся меню. Появится диалоговое окно Завершение Работы. Окно содержит кнопки-переключатели: Выключить компьютер. Перезагрузить компьютер. Перезагрузить компьютер в режиме эмуляции MS DOS , Войти в систему под другим именем. Все кнопки закрывают все программы. В нижней части окна Shut Down Windows расположены три кнопки - Да, Нет, Справка. Через небольшой промежуток времени после щелчка мышью кнопки Да компьютер будет подготовлен к выключению: будут очищены внутренние буферы и кэши дисков, обеспечено сохранение данных. Не следует выключать электропитание до тех пор, пока не появится сообщение: «Теперь питание компьютера можно выключить».
Мы ограничимся лишь приведенным выше кратким описанием принципов работы Windows. Реальное ее освоение (еще в большей мере, чем DOS и Norton Commander) - дело практических занятий за компьютером с помощью как многочисленных специальных руководств, так и встроенного справочника.
Контрольные вопросы и задания1. Охарактеризуйте место операционных систем среди других видов программного обеспечения.
2. Каковы функции операционной системы?
3. Охарактеризуйте основные ступеньки эволюции операционных систем.
Процесс?
Виртуализация?
Прерывание?
5. Охарактеризуйте функции основных компонент операционных систем.
6. В чем состоит назначение файловой системы ОС?
7. Что такое файл? Какие структуры файлов поддерживаются различными ОС?
8. Что такое каталог (директорий)? Для чего каталоги служат?
9. Какие операции над файлами обеспечиваются операционными системами?
10. Охарактеризуйте команды операционной системы MS DOS.
11. Опишите интерфейс оболочки ОС Norton Commander.
12. Охарактеризуйте стиль работы с помощью оболочки Windows.
13. По каким показателям Windows"95 превосходит Windows 3.11?
14. Опишите типичное окно Windows"95.
15. Какие функции выполняют меню Пуск? Поиск?
16. Как вызвать динамическое меню и каковы его возможности?
§ 2. ПОНЯТИЕ О СИСТЕМЕ ПРОГРАММИРОВАНИЯ2.1. ОСНОВНЫЕ ФУНКЦИИ И КОМПОНЕНТЫСистемы программирования - это комплекс инструментальных программных средств, предназначенный для работы с программами на одном из языков программирования. Системы программирования предоставляют сервисные возможности программистам для разработки их собственных компьютерных программ.
В настоящее время разработка любого системного и прикладного программного обеспечения осуществляется с помощью систем программирования, в состав которых входят
Трансляторы с языков высокого уровня;
Средства редактирования, компоновки и загрузки программ;
Макроассемблеры (машинно-ориентированные языки);
Отладчики машинных программ.
Системы программирования, как правило, включают всебя
Текстовый редактор (Edit ), осуществляющий функции записи и редактирования исходного текста программы;
Загрузчик программ (Load ), позволяющий выбрать из директория нужный текстовый файл программы;
Запускатель программ (Run ), осуществляющий процесс выполнения программы;
Компилятор (Compile ), предназначенный для компиляции или интерпретации исходного текста программы в машинный код с диагностикой синтаксических и семантических (логических) ошибок;
Отладчик (Debug ), выполняющий сервисные функции по отладке и тестированию программы;
Диспетчер файлов (File ), предоставляющий возможность выполнять операции с файлами:сохранение, поиск, уничтожение и т.п.
Ядро системы программирования составляет язык. Существующие языки программирования можно разделить на две группы: процедурные и непроцедурные, рис. 2.9.
Процедурные (или алгоритмические) программы представляют из себя систему предписаний для решения конкретной задачи. Роль компьютера сводится к механическому выполнению этих предписаний.
Процедурные языки разделяют на языки низкого и высокого уровня.
Языки низкого уровня (машинно-ориентированные) позволяют создавать программы из машинных кодов, обычно в шестнадцатиричной форме. С ними трудно работать, но созданные с их помощью высококвалифицированным программистом программы занимают меньше места в памяти и работают быстрее. С помощью этих языков удобнее разрабатывать системные программы, драйверы (программы для управления устройствами компьютера), некоторые другие виды программ.
Рис. 2.9. Общая классификация языков программирования
Программы на языках высокого уровня близки к естественному (английскому)
языку и представляют набор заданных команд.
Перечислим наиболее известные системы программирования.
1. Фортран (FORmula TRANslating system - система трансляции формул); старейший и по сей день активно используемый в решении задач математической ориентацииязык.
2. Бейсик (Beginner"s All-purpose Symbolic Instruction Code - универсальный символический код инструкций для начинающих); несмотря на многие недостатки и изобилиеплохо совместимых версий - самый популярный по числу пользователей.
3. Алгол (ALGOrithmic Language - алгоритмический язык); сыграл большую роль в теории, но для практического программирования сейчас почти не используется.
4. ПЛ/1 (PL/I Programming Language - язык программирования первый). Многоцелевой язык; сейчас почти не используется.
5. Си (С - «си»); широко используется при создании системного программного обеспечения.
6. Паскаль (Pascal - назван в честь ученого Блеза Паскаля); чрезвычайно популярен как при изучении программирования, так и среди профессионалов. На его базе созданы несколько более мощных языков (Модула, Ада, Дельфи).
7. Кобол (COmmon Business Oriented Language - язык, ориентированный на общийбизнес); в значительной мере вышел из употребления.
8. Дельфи (Delphi) - язык объектно-ориентированного «визуального» программирования; в данный момент чрезвычайно популярен.
9. Джава (Java) - платформенно-независимый язык объектно-ориентированного программирования, чрезвычайно эффективен для создания интерактивных веб-страниц.
Среди непроцедурных языков наиболее известны
1. Лисп (Lisp);
2. Пролог (PROgramming in LOGic);
3. Оккам (назван в честь философа У. Оккама).
Широкое распространение среди разработчиков программ, а также при обучении программированию, получили системы программирования «Турбо» (Turbo) фирмы Borland, ядром которых являются трансляторы с языков программирования Бейсик, Паскаль, Си, Пролог и др. Интерфейс Турбо-оболочки для любых систем программирования внешне совершенно одинаков и предоставляет пользователю стандартный набор функций и команд, описанных выше и отображаемых в главном меню системы.
Рассмотрим технологию разработки программ с использованием популярной системы программирования Турбо-Паскаль 7 (оставив знакомство с самим языком до следующей главы).
В подобных интегрированных системах программирования сделана попытка предоставить разработчику программ максимум сервисных возможностей. Помимо основных функций система Турбо-Паскаль 7 позволяет настроить компилятор на работу в трех режимах: обычном режиме MS DOS (Real), защищенном режиме (Protected) и в режиме операционной среды Windows (Windows).
После загрузки системы (файл TURBO. EXE), на экране монитора появляется интерфейсное окно, рис. 2.10.
Рис. 2.10. Вид экрана интегрированной среды Турбо-Паскаля версии 7 (монтаж)
Главное меню системы (верхняя строка экрана) содержит команды, которые позволяют осуществлять следующие виды работ:
File - работа с файлами (сохранение, загрузка, связь с операционной
системой);
Edit - работа с текстовым редактором (после загрузки системы по умолчанию
текстовый редактор находится в активном состоянии);
Search - поиск и замена фрагментов текста;
Run -запуск программы на выполнение;
Compile - компиляция программы и установка параметров компиляции;
Debug - установка параметров отладки программы;
Tools - инструментальные программные средства (ненавязчивый сервис);
Options -установка опций интегрированной среды;
Window - работа с окнами;
Help -система помощи и подсказок.
Для начала работы с системой программирования необходимо иметь проект текста программы, который можно набирать на рабочем поле окна системы. Встроенный текстовый редактор прост и максимально приспособлен для набора текстов программ на языке Паскаль. В нем предусмотрена специальная подсветка управляющих структур, команд. Удобна система контекстной помощи (Shift+Fl), которая вызовет подсказку по набираемому текущему тексту программы в любой момент и в любом месте. Впрочем, текст программы можно приготовить в любом текстовом редакторе, хранящем тексты в ASCII-кодах (например, в Лексиконе); необходимо лишь снабдить имя файла расширением.pas.
Если текст (тексты) программы был ранее сохранен на жестком диске или дискете, то он может быть загружен в поле редактирования с помощью пункта меню File .
После окончания формирования текста необходимо откомпилировать программу (пункт меню Compile). Если в программе есть ошибки, то компилятор их укажет. После исправления ошибок можно снова повторить компиляцию.
После удачной компиляции запуск программы осуществляется командой менюRun .
Но на этом этапе чаще всего работа не заканчивается. Сложные алгоритмы требуют тестирования и отладки. Многие программы составляются из отдельных модулей, требуют связи с другими программами и системами и т.д. Для решения всех этих проблем предназначены другие команды системы (Debug , Options и пр.).
Разумеется, программисту, работающему на Паскале, нет нужды самому программировать такие непростые, но часто встречающиеся операции, как вычисление значений математических функций, построение изображений простых геометрических объектов (отрезков прямых, окружностей и т.д.), очистка экрана и множество других. Высокоэффективные, тщательно отлаженные программы таких действий сведены в стандартные модули и надо лишь уметь к ним обратиться. В состав пакета библиотек стандартных модулей входят:Crt - работы с экраном, Graph -работы с графикой и другие, такие как Overlay , String , System , Turbo 3 ,WinAPI , WinCrt , WinDos , WinPrn , WinTypes , WinProcs .
2.2. ТРАНСЛЯЦИЯ ПРОГРАММ И СОПУТСТВУЮЩИЕ ПРОЦЕССЫС появления первых компьютеров программисты серьезно задумывались над проблемой кодирования компьютерных программ. Уже с конца 40-х годов стали появляться первые примитивные языки программирования высокого уровня. В них программист записывал решаемую задачу в виде математических формул, а затем, используя специальную таблицу, переводил символ за символом, преобразовывал эти формулы в двухлитерные коды. В дальнейшем специальная программа (впоследствии названная интерпретатором) превращала эти коды в двоичный машинный код. Первый компилятор был разработан Г. Хоппер в начале 50-х годов; он осуществлял функцию объединения команд и в ходе трансляции производил организацию подпрограмм, выделение памяти компьютера, преобразование команд высокого уровня (в то время псевдокодов) в машинные команды. В дальнейшем компиляторы и интерпретаторы для языков Ассемблера стали развиваться и прочно вошли в практику компьютерного дела.
Идеи трансляции (перекодирования) одних символов в другие легли в основу создания различных языков программирования с соответствующими трансляторами - компиляторами и/или интерпретаторами. Отличие компиляторов от интерпретаторов заключается в процедуре трансляции текста в машинный код. Компилятор преобразует весь текст программы в последовательный набор машинных команд, который в дальнейшем отправляется на выполнение (пример компилятора с языка Паскаль). Интерпретатор же осуществляет трансляцию по принципу синхронного перевода. Каждая отдельная строка программного текста транслируется, а затем, после ее интерпретации, команды этой строки выполняются (пример языка Бейсик). Современные трансляторы с языков программирования высокого уровня, систем управления базами данных интегрируют в себе возможности и достоинства компиляторов и интерпретаторов, а в системы программирования добавляют различные сервисные утилиты по трансляции и отладке создаваемых программ.
Важнейшим элементом в развитии систем программирования выступили подпрограммы. Появление аппарата подпрограмм существенно облегчило процесс разработки системных и прикладных программ. Подпрограммы позволили формировать библиотеки из наиболее часто употребляемых в программах алгоритмов -процедур и функций. В системах программирования обязательно присутствуют стандартные (встроенные в систему) библиотеки подпрограмм. Например, в их число входят подпрограммы вычисления математических функций sin(х), cos(x), abs(х) и др.
В настоящее время распространены пользовательские и прикладные библиотеки подпрограмм. Их число увеличивается. Меняется структура библиотечных подпрограмм. В современных языках получили распространение модули (Unit ), представляющие специализированные пакеты взаимосвязанных подпрограмм определенного предназначения, например по работе с клавиатурой, с графикой и пр. Развитие объектно-ориентированного программирования позволило создавать библиотеки объектов и подпрограмм с объектными типами данных (Object ). Примером могут служить оболочки типа TurboVision .
Современная программа представляет набор команд, операторов и выражений, в которых имеются ссылки (прямые или косвенные) на различные подпрограммы из существующих в системе программирования библиотек, модулей, объектов. В этой связи исходный текст программы, как правило, занимает по объему места в памяти в несколько раз меньше, чем его оттранслированный вариант в машинных кодах. Как это происходит?
Рассмотрим один из вариантов трансляции программы с языка программирования Паскаль. Исходный текст программы решения квадратного уравнения представленниже:
program KvadUravn;
var А, В, С, D, XI, Х2: REAL;
writeln("введи А,В,С") ; read(A,B,C);
if D
