Offline-редактор NoNaMe. Часть 1.

Этим постом я открываю серию статей по созданию простого off-line редактора новостей для NoNaMe. Надеюсь, эти статьи помогут Вам понять, как легко можно сделать практически любую программку под свои нужды. Эта серия будет состоять из нескольких частей. Сегодня рассмотрим самую простую часть – интерфейс. Да-да, не удивляйтесь. Многие любят Delphi именно за простоту работы с интерфейсами программ, многие за это ругают, но для новичков – это самое лучшее начало, по моему мнению. Итак, начнем…

В этой серии я буду использовать Delphi 7, но только по одной причине – именно эта версия стоит у меня на работе. Дома я использую Turbo Delphi и следующая серия статей будет написана с использованием именно ее. Однако, все, что я приведу в этой серии можно написать и на Delphi 6 и на Turbo Delphi… Ничего специализированного для конкретной версии я использовать не буду.

Еще один момент. В данной статье, т.к. она ориентирована больше на начинающих, я буду идти «с конца». Что это значит? Это значит, что мы пойдем в обратной последовательности от правильной – сначала создадим интерфейс (это поможет новичкам понять, как просто сделать фейс программы в Delphi), а уже потом будем делать начинку программы.

Создаем новый проект – Файл -> New -> Application:

В итоге мы имеет одну форму – Form1. Давным-давно, я приучил себя сразу переименовывать компоненты, чтобы потом не гадать, что такое, например, Form12 (особенно, когда их 40-50 шт., да еще и созданы разными людьми). Этому же я призываю и Вас, уважаемые читатели. Как только Вы что-то создали в программе – задавайте понятные и легко-читаемые имена. Заодно, сразу расставляем необходимые параметры. Я не буду расписывать, кокой параметр за что отвечает (для этого есть куча книг), но если что-то не понятно – можете задать вопрос в комментариях и я постараюсь ответить. Вот, что получилось у меня:

Caption: Offline Editor
Name: frmMain
Position: poScreenCenter

Идем далее. А далее необходимо настроить сам проект, но перед этим сохранить его. Тут, как и с именами параметров, можно поступить по разному. Можно просто все складывать в один каталог, а можно разносить по нескольким, чтобы потом было проще найти где что. Я поступаю в соответствии с последним – создаю каталог для проекта, а в нем минимум 2 подкаталога (чаще – намного больше): units и _release_. Первый для хранения исходных файлов проекта, второй – для того, чтобы Delphi сохраняла откомпилированную программу именно туда. Как это настроить объясню немного позже. А пока сохраняем:

Советую при сохранении, также как и компонентам и параметрам, давать понятные и легко-читаемые названия сохраняемым модулям.
Вот теперь самое время настроить параметры проекта. Открываем их – Project -> Options (или нажимаем Shift+Ctrl+F11). Появляется форма с закладками:

На данный момент нам необходимы не все закладки, а только Application и Directories/Conditionals. Начнем с Application:

Тут можно задать название программы, которое будет отображаться на панели задач (строка Title) и иконку для программы. Внимание: здесь можно задать иконку программы с максимальной глубиной цвета в 16 бит, т.е. нельзя добавить иконки с прозрачностью и глубиной цвета в 32 бит (родные для XP и Vista). Как устанавливать такие иконки – мы рассмотрим как-нибудь в следующий раз…

Теперь перейдем к вкладке Directories/Conditionals:

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

Все. Саму форму мы настроили. Теперь займемся расположением компонентов на ней. Тут каждый делает сам под себя. У меня получилось следующее:

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

Я приведу здесь только некоторые моменты. Начнем с Cut/Copy/Paste/Undo/Select All. Почему с них? Все просто. Для TMemo в Delphi уже есть готовые акшены и было бы не правильно «изобретать колесо». В ActionList нажимаем New Standart Action и выбираем необходимые нам команды:

Переименовываем/меняем иконки выбранным экшенам и подключаем к меню/тулбару. С данными пунктами закончили. Теперь переходим к «форматированию» текста в редакторе. Точнее не форматирования, а BB-коды в редакторе. Объясню на примере одного, остальные – в качестве домашнего задания =))).

Для вставки BB-кода в редактор необходимо предусмотреть два варианта: первый – когда в редакторе нет выделенного текста, т.е. необходимо просто вставить пару кодов (или один BB-код, в зависимости от того, что вставляете) в позицию курсора. И второй вариант – когда в редакторе выделен какой-то текст и его необходимо обозначить определенным кодом. Давайте возьмем, для примера, код [ B ] – выделение текста жирным начертанием. Берем первый случай:

if mmText.SelLength = 0 then
    begin
      mmText.SelText := C_B_Bold + C_E_Bold;
      mmText.SelStart := mmText.SelStart - Length(C_E_Bold);
      mmText.SelLength := 0;
    end;

Разберем данный код построчно. Первая строка проверяет, есть ли выделенный текст или нет. Следом за begin мы вставляем в место выделения пару BB-кодов, которые описаны у меня в отдельном юните как (конечно без пробелов):

const
  C_B_Bold = '[ b ]';
  C_E_Bold = '[ /b ]';

т.е. таким образом мы вставляем необходимый нам текст в позицию курсора. Следующая строка перемещает курсор назад на длину закрывающего BB-тега. Это сделано для того, чтобы после этих операций курсор встал между тегами и пользователь мог начать вводить текст. Ну и последняя строка, перед end, устанавливает длину выделенной части равной нулю. В принципе, эта строка не нужна, но такая у меня привычка =).

Теперь рассмотрим второй случай, когда у нас в редакторе есть выделенный текст:

mmText.SelText := C_B_Bold + mmText.SelText + C_E_Bold;

Все =))). Это весь код. Что он означает – Вы наверное уже поняли, если читали то, что написано до этого. Итого, у нас получилось следующее:

procedure TfrmMain.actBoldExecute(Sender: TObject);
begin
  if mmText.SelLength = 0 then
    begin
      mmText.SelText := C_B_Bold + C_E_Bold;
      mmText.SelStart := mmText.SelStart - Length(C_E_Bold);
      mmText.SelLength := 0;
    end else
      mmText.SelText := C_B_Bold + mmText.SelText + C_E_Bold;
end;

На основе этого кода Вам будет не сложно сделать остальное, кроме изображений. Изображения и отправку новости на сервер мы рассмотрим в следующей статье, т.к. необходимо решить, как именно осуществлять вставку – сразу загружать изображения на сервер и потом вставлять ссылку в текст или сначала вставлять ссылку в текст, потом, перед отправкой новости на сервер, отправлять изображения, заменяя ссылки в тексте и только потом отправлять саму новость. Первый вариант проще, второй практичнее. Выбирайте =)…

Кстати, в своем коде я сделал немного по другому. Если хотите учиться программировать, сначала сделайте как написано в статье, потом попробуйте оптимизировать немного, а потом посмотрите в мой код…

Остальной код я приводить не буду, т.к. он элементарный. Но, если возникнут сложности или вопросы – задавайте в комментариях смело, постараюсь ответить как-можно быстрее.

[cut]

P.S.: по определенным причинам эта часть получилась не завершенной. Но мы обязательно продолжим...
P.S.S.: Проект.