Карта сайтаСсылкиКонтакты

Создаем текстовый редактор в Delphi

PDF Печать
Статьи
Индекс материала
Создаем текстовый редактор в Delphi
Добавление меню и панели инструментов
Добавление стандартный действий
Добавление меню в приложение
Добавляем Панель инструментов
Создание справки
Окно О программе...
Все страницы

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

Создаем новое приложение

Перед тем, как начинать новое приложение, создайте папку для хранения файлов проекта (например, MyEditor).

Создайте новый проект. При его создании, Delphi автоматически создает файлы:

  • Project1.dpr - исходный код проекта. Он называется файл проекта
  • Unit1.pas - исходный код формы, называется файл модуля
  • Unit1.dfm - файл ресурсов, который содержит информацию о главной форме проекта, называется файл формы.

Каждая форма имеет свои собственные файлы модуля (Unit1.pas) и главной формы (Unit1.dfm).

Вторая форма создаст свои собственные файлы Unit2.pas и Unit2.dfm.

Сохраните проект под именем MyNotepad.dpr в папку, которую Вы создали. Имя формы можно оставить по умолчанию (Unit1.pas).

В Вашем каталоге также появятся файлы MyNotepad.cfg (файл конфигурации), MyNotepad.dof (файл параметров) и MyNotepad.res (файл ресурсов). Их удалять не нужно!

Пустая форма с кнопками управления формой

По умолчанию, форма в проекте имеет три кнопки (свернуть, восстановить и закрыть). Если Вы сейчас запустите проект клавишей F9, откроется пустая форма. Чтобы закрыть ее, нажмите кнопку закрытия формы.

Инспектор объектов

Рядом с формой Вы увидите Инспектор Объектов, который Вы можете использовать для установки свойств формы и компонентов, которые будут на ней расположены.

В данном случае, он отображает свойства нашей формы. Объект Form1 и его тип TForm1.

Когда объект выбран, Инспектор Объектов показывает его свойства.

Установка значений свойств

Вы можете сразу изменить заголовок формы Form1. Для этого в Инспекторе Объектов найдите свойство Caption для Form1 и замените текст на My Notepad. Обратите внимание, что заголовок на форме меняется с тем, как Вы меняете текст.

Добавление объектов на форму

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

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

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

Delphi включает в себя множество объектов, которые представляют части приложения. Например, есть объекты (компоненты), которые позволяют легко программировать меню, панели инструментов, диалоговые окна, а также сотни других визуальных (и не визуальных) программных элементов.

Палитре компонентов VCL представляет компоненты с помощью значков, которые сгруппированы по вкладкам. Для того, чтобы добавить компонент, нужно выбрать компонент на палитре, а затем щелкнуть на форме в том месте, где Вы хотите его разместить. Также можно дважды щелкнуть компонент на Палитре компонентов, и тогда компонент будет автоматические помещен в центр формы. Для того, чтобы получить справку по компоненту, нужно выбрать его и нажать клавишу F1.

Палитра компонентов

Помещаем RichEdit на форму

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

RichEdit на палитре компонентов

Дважды щелкните на нем и он будет помещен на форму.

Форма с помещенным на нее RichEdit

Каждый компонент Delphi является классом; помещенный на форму компонент автоматически создает экземпляр этого класса. Как только компонент будет помещен на форму, Delphi генерирует код, необходимый для создания экземпляра этого объекта во время выполнения приложения.

Устанавливаем свойство Align компонента RichEdit в alClient

Инспектор объектов со свойствами RichEdit

Для этого, нажмите на RichEdit, чтобы выбрать его на форме, затем в Инспекторе объектов выберите свойство Align, а в выпадающем списке свойство alClient.

RichEdit заполнит всю клиентскую область формы, чтобы иметь большую площадь для редактирования текста. Таким образом, при выбранном свойстве alClient, RichEdit будет занимать всю область формы, даже если размер формы будет изменяться.

Устанавливаем StatusBar на форму

Дважды щелкните на значке компонента StatusBar на вкладке Win32 Палитры компонентов, это добавит строку состояния в нижнюю часть формы.

StarusBar на палитре компонентов

Далее, нам нужно создать место, где будет отображаться имя редактируемого файла. Есть два способа отобразить текст в строке состояния.

Самый простой способ – это установка свойства SimplePanel в True объекта StatusBar1 и назначить любой текст, который Вы хотите отобразить в свойстве SimpleText.

Но можно и записать в коде, например:


StatusBar1.SimpleText:= ‘untitled.txt’

Пока у нас присутствует только одна панель в строке состояния. В дальнейшем, можно будет добавлять еще панели. Об этом будет рассказано в дальнейшем.

Дважды щелкните на StatusBar для отображения диалогового окна редактора панелей StatusBar.

Диалоговое окно редактора панелей StatusBar

Щелкните правой кнопкой в диалоговом окне и выберите Add для добавления панели в StatusBar.

Добавленная панель в StatusBar

Свойство Panels – это массив, который начинается с нуля и позволяет получить доступ к каждой панели, которую Вы создали. Закройте диалоговое окно.


Добавление меню и панели инструментов

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

Ниже приведены все команды, которые нам потребуются при создании текстового редактора.

Команда Меню Есть на панели инструментов? Описание
Новый Файл Да Создается новый файл.
Открыть Файл Да Открывается созданный файл для редактирования.
Сохранить Файл Да Сохраняется текстовый файл на диск.
Сохранить как Файл Нет Сохраняется файл, используя новое имя.
Выход Файл Да Выход из программы.
Вырезать Правка Да Удаляет текст и сохраняет в буфере обмена.
Копировать Правка Да Копирует текст и сохраняет в буфере обмена.
Вставить Правка Да Вставляет текст из буфера обмена.
Содержание Помощь Да Отображает содержание справочного файла.
Индекс Помощь Нет Отображает страницу индекса справочного файла.
О программе Помощь Нет Отображает информацию о программе в окне.

Также можно собрать все изображения для панели инструментов в ImageList.

Для того, чтобы добавить ActionList и ImageList на форму, проделайте следующее:

  1. На Палитре компонентов , на вкладке Standard щелкните на значок компонента ActionList и щелкните на форму в любом месте. Не имеет значения, в каком месте на форме он будет находиться, т.к. это не визуальный компонент и отображаться во время выполнения программы не будет.

  2. На вкладке Win32 выберите компонент ImageList и поместите его на форму. Также можете поместить его в любом месте.

Ваша форма должна выглядеть примерно так:

Форма с добавленными на нее ActionList и ImageList

Добавляем действия в ActionList

Далее мы будем добавлять действия в ActionList.

1. Сделайте двойной щелчок на ActionList, который находится на форме. Откроется диалоговое окно Editing Form1.ActionList. Оно называется редактор списка действий.

2. Щелкните правой кнопкой на редакторе и выберите New Action.

Добавляем новое действие в ActionList

3. В Инспекторе объектов установите следующие свойства для этого действия:

  • Свойство Caption установите равным &Новый. Обратите внимание, что мы добавили амперсанд перед первой буквой. Это будет горячая клавиша.
  • В поле Category напишите Файл. Это организует команды меню Файл в одном месте.
  • Свойство Hint установите равным Создать файл (это будет подсказка).
  • В поле ImageIndex запишите 0 (это будет ассоциировать изображение номер 0 в Вашем ImageList).
  • В поле Name введите FileNew (для команды Файл -> Новый).
Добавление пункта Файл

4. Щелкните правой кнопкой на Редакторе действий и выберите New Action.

5. В Инспекторе объектов установите следующие свойства для нового действия:

  • Caption равен &Открыть.
  • Убедитесь, что Category равна Файл.
  • В свойстве Hint введите Открыть файл.
  • ImageIndex равен 1.
  • В поле Name введите FileOpen (для команды Файл -> Открыть).

6. Щелкните правой кнопкой на Редакторе действий и выберите New Action.

7. В Инспекторе объектов установите следующие свойства:

  • Caption - &Сохранить.
  • Убедитесь, что в Category выбран Файл.
  • В поле Hint введите Сохранить файл.
  • ImageIndex равен 2.
  • Name установите в FileSave (для команды Файл -> Сохранить).

8. Щелкните правой кнопкой в Редакторе действий и выберите New Action.

9. В Инспекторе объектов установите следующие свойства:

  • CaptionСохранить &как.
  • CategoryФайл.
  • HintСохранить файл как.
  • Поле ImageIndex не трогайте (оставьте по умолчанию), здесь изображение не требуется.
  • NameFileSaveAs (для команды Файл -> Сохранить как).

10. Щелкните правой кнопкой в Редакторе действий и выберите New Action.

11. В Инспекторе объектов установите следующие свойства:

  • CaptionВ&ыход.
  • CategoryФайл.
  • strong>Hint – Выход из программы.
  • ImageIndex3.
  • NameFileExit (для команды Файл -> Выход).

12. Щелкните правой кнопкой на Редакторе действий и выберите New Action для создания команд справки.

13. В Инспекторе объектов введите следующие свойства:

  • В поле Caption введите С&одержание.
  • В поле Category введите Помощь.
  • В поле Hint введите Отобразить справку.
  • В ImageIndex введите 7.
  • В Name введите HelpContents (для команды Помощь -> Содержание).

14. Щелкните правой кнопкой на Редакторе действий и выберите New Action.

15. В Инспекторе объектов установите следующие свойства:

  • Caption - &Индекс.
  • CategoryПомощь.
  • В поле Name введите HelpIndex (для Помощь -> Индекс).

16. Щелкните правой кнопкой на Редакторе действий и выберите New Action.

17. В Инспекторе объектов установите следующие свойства:

  • Caption установите в О &программе….
  • CategoryПомощь.
  • В поле Name запишите HelpAbout (меню Помощь -> О программе…).

Редактор действий пусть остается на экране.


Добавление стандартный действий в список действий

Delphi предоставляет некоторые стандартные действия, которые довольно часто встречаются при разработке приложений. Давайте и мы добавим стандартные действия (Копировать, Вырезать и Вставить) в наш Action List.

Для того, чтобы добавить стандартные действия в список действий, проделайте следующее:

  1. Щелкните правой кнопкой мыши на Редакторе действий и выберите New Standard Action…. Отобразится список с доступными стандартными действиями. Для выбора дважды щелкните на нужное действие.
  2. Выбор из меню New Standard Action... Окно выбора стандартных действий
  3. Сделайте двойной щелчок на TEditCut. При этом создастся новая категория Edit с действием EditCut1.
  4. В Инспекторе объектов установите для него свойство ImageIndex равным 4, в Category напишите Правка, остальные свойства не будем менять.
  5. Щелкните правой кнопкой мыши на Редакторе действий и выберите New Standard Action…
  6. Сделайте двойной щелчок на TEditCopy.
  7. В Инспекторе объектов установите свойство ImageIndex равным 5, Category - Правка.
  8. Еще раз щелкните на Редакторе действий и выберите New Standard Action…
  9. Выберите TEditPaste.
  10. В Инспекторе объектов установите ему свойство ImageIndex равным 6, Category - Правка.

Теперь у Вас есть все необходимые действия.

Если теперь Вы щелкните в списке категорий на All Actions, то увидите все действия. которые мы добавили.

Окно All Actions отображает все действия, которые мы добавили

Закройте редактор Action List.

Теперь, выберите на форме компонента ActionList1 и установите его свойство ImagesImageList1.

Установка свойства Images компонента ActionList

Добавляем изображения в ImageList

Раньше, мы уже добавили ImageList на форму. Теперь мы будем загружать его изображениями для панели инструментов и пунктов меню. Вот изображения, которые можно использовать для каждой команды.

Меню Файл ImageIndex
Файл -> Открыть FileOpen.bmp 0
Файл -> Новый FileNew.bmp 1
Файл -> Сохранить FileSave.bmp 2
Файл -> Выход FileExit.bmp 3
Правка -> Вырезать Cut.bmp 4
Правка -> Копировать Copy.bmp 5
Правка -> Вставить Paste.bmp 6
Помощь -> Содержание Help.bmp 7

Изображения можно скачать здесь.

Чтобы добавить изображения в ImageList, нужно проделать следующее:

  • Сделайте двойной щелчок на ImageList для отображения редактора списка изображений.
  • Щелкните на кнопке Add и перейдите в каталог, где расположены изображения кнопок. В Borland Delphi это C:\Program Files\Common Files\Borland Shared\Images\Buttons или воспользуйтесь этими изображениями кнопок.
  • Выберите файл Fileopen.bmp.

Так же добавьте остальные кнопки, руководствуясь таблицей.

Когда добавите все изображения щелкните ОК в редакторе списка изображений для сохранения изменений. Далее щелкните на объекте ActionList для открытия Редактора действий. У Вас должно быть что-то, наподобие этого:

Action List Editor с подключенными изображениями

Теперь можно закрыть Редактор действий. Мы готовы для добавления меню и панели инструментов в наше приложение.


Доавляем меню в приложение

В этой части мы будет добавлять Главное меню с тремя раскрывающимися меню – Файл, Правка и Помощь.

Из Палитры компонентов, на вкладке Standard возьмите компонент TMainMenu и поместите его на форму. Установите его свойство Images в ImageList1. Это позволит добавлять изображения к пунктам меню.

Сделайте двойной щелчок на MainMenu1, откроется окно Дизайнера меню.

Окно разработчика меню

В Инспекторе объектов введите &Файл в свойство Caption и нажмите Enter.

Свойство Caption меню первого уровня

В Дизайнере меню выберите пустой пункт под меню Файл, который Вы только что создали. В свойстве этого элемента Action выберите FileNew.

Установкить свойство Action равным FileNew

Далее добавьте под ним пункт меню Открыть (свойство Action = FileOpen) , затем Сохранить (FileSave), Сохранить Как (FileSaveAs).

Затем добавьте разделитель меню. Для этого перейдите на следующий пункт меню и в свойстве Caption введите – (тире).

И, наконец, создайте пункт меню Выход под разделителем меню.

Добавление пунктов меню в меню Файл

Далее создадим меню Правка. Для этого перейдите к пустому пункту справа от меню Файл и щелкните на нем. И проделайте то же, что и с меню Файл.

Добавление пунктов меню в меню Правка

Далее создайте меню Помощь.

Добавление пунктов меню в меню Помощь

Закройте Дизайнер меню и сохраните проект.

Запустите проект, нажав клавишу F9. Вы должны увидеть такое окно:

В текстовом поле выводится имя TRichEdit объекта

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

Очистка области текста

При запуске программы, в текстовом поле появляется имя управления TRichEditRichEdit1. Вы можете удалит этот текст в свойстве Lines, дважды щелкнув на нем. Но это не обязательно, так как мы будем программно очищать текстовое поле в дальнейшем.


Добавляем Панель инструментов

Так как у нас уже есть действия в Action List, то мы можем добавить Панель инструментов и присвоить ей действия.

На Палитре компонентов вкладке Win32 дважды щелкните на компоненте TToolBar. Панель инструментов добавится на форму.

Установите его свойство Indent равным 4, а свойству ImagesImageList1. ShowHint установите в True.

Щелкните правой кнопкой на компоненте ToolBar и выберите пункте меню New Button. Добавится новая кнопка, присвойте ей свойство ActionFileNew. Затем FileOpen и FileSave. Затем вместо добавления кнопки, нажмите на меню Add Separator, чтобы добавить разделитель между кнопками. Далее идут кнопки со значениями Action: EditCopy1, EditCut1 и EditPaste1. Разделитель. Далее HelpContents, разделитель и FileExit.

Добавили компонент ToolBar

Пишем обработчики событий

До этого момента мы создавали приложение, не написав ни одной строчки кода. Теперь нужно заставить приложение выполнять команды.

Для начала давайте добавим глобальную переменную FileName в разделе public нашей формы.


public
  { Public declarations }
  FileName: string;

Создать

Теперь вернемся к форме. Выберите компонент ActionList1, дважды щелкните на нем, в Редакторе действий дважды щелкните на действии FileNew. Событие создано, нужно записать код.


procedure TForm1.FileNewExecute(Sender: TObject);
begin
  RichEdit1.Clear;
  FileName:= 'Untitled.txt';
  StatusBar1.Panels[0].Text:= FileName;
end;

Открыть

Для команды Открыть файл, нужно добавить компонент TOpenDialog на форму, он находится на вкладке Dialogs.

В Инспекторе объектов установите его свойство DefaultExt равным txt. Дважды щелкните на свойстве Filter для открытия диалогового окна установки фильтра файлов. Заполните, как на рисунке.

Добавляем фильтр файлов в TOpenDialog

В свойстве Title напишите Открыть файл.

В Редакторе действий дважды щелкните на FileOpen и запишите следующий код:


procedure TForm1.FileOpenExecute(Sender: TObject);
begin
  if OpenDialog1.Execute then
  begin
    RichEdit1.Lines.LoadFromFile(OpenDialog1.FileName);
    FileName:= OpenDialog1.FileName;
    StatusBar1.Panels[0].Text:= FileName;
  end;
end;

Сохранить

Чтобы создать обработчик Сохранить, дважды щелкните на пункте FileSave в Редакторе действий. Запишите следующий код:


procedure TForm1.FileSaveExecute(Sender: TObject);
begin
  if FileName = 'Untitled.txt' then
    FileSaveAsExecute(nil)
  else
    RichEdit1.Lines.SaveToFile(FileName);
end;

Этот код отображает диалоговое окно Сохранить как, если у файла еще нет имени и пользователь может задать ему имя.

Сохранить как

Теперь поместите компонент SaveDialog на форму. При вызове этого окна для сохранения файла, будет отображаться стандартное диалоговое окно сохранения файла Windows.

В Инспекторе объектов установите его свойство DefaultExt равным txt. Свойство Filter установите так же, как мы уже делали с командой Открыть.

В свойстве Title напишите Сохранить как.

В Редакторе списка действий дважды щелкните на пункте FileSaveAs. Запишите следующий код:


procedure TForm1.FileSaveAsExecute(Sender: TObject);
begin
  SaveDialog1.FileName:= FileName;
  SaveDialog1.InitialDir:= ExtractFilePath(FileName);
  if SaveDialog1.Execute then
  begin
    RichEdit1.Lines.SaveToFile(SaveDialog1.FileName);
    FileName:= SaveDialog1.FileName;
    StatusBar1.Panels[0].Text:= FileName;
  end;
end;

Выход

В Редакторе действий дважды щелкните на пункте FileExit и запишите следующий код:


procedure TForm1.FileExitExecute(Sender: TObject);
begin
  Close;
end;

Теперь можно запустить приложение клавишей F9 и посмотреть, что у нас получилось:

Проверяем работу текстового редактора

Создание справочного файла

Правила хорошего программирования приложений рекомендуют нам создавать справочный файл, в котором будет разъясняться правила работы с приложением и отдельными его компонентами. Delphi предоставляет инструмент для создания справочного файла. Это Microsoft Help Workshop, который находится в папке Help/Tools. При использовании текстового редактора, пользователь может выбрать Помощь для доступа к файлу справки.

Прежде всего, нужно создать RTF файл в редакторе (например, MS Word). Документ может содержать графические изображения и таблицы, иметь стили шрифта и оформления. Помимо справочной информации, он будет также иметь управляющие теги.

Подробней об этом процессе можно найти информацию здесь и на сайте Borland.

Обработчик событий для справки

Для создания обработчика событий меню Помощь нужно сделать следующее:

  • Откройте редактор Action List, дважды щелкнув по нему на форме.
  • В Редакторе Action List выберите категорию Помощь и дважды щелкните на HelpContents. Откроется Редактор кода.
  • Введите следующий код:

procedure TForm1.HelpContentsExecute(Sender: TObject);
const
  HELP_TAB = 15;
  CONTENTS_ACTIVE = -3;
begin
  Application.HelpCommand(HELP_TAB, CONTENTS_ACTIVE);
end;

Этот код содержит значения параметров HelpCommand. HELP_TAB отображает диалоговое окно справки, а CONTENT_ACTIVE – отображает содержание справки.

Создание события Индекс

Теперь дважды щелкните на HelpIndex в Редакторе Action List и запишите следующий код:


procedure TForm1.HelpIndexExecute(Sender: TObject);
const
  HELP_TAB = 15;
  CONTENT_ACTIVE = -2;
begin
  Application.HelpCommand(HELP_TAB, CONTENT_ACTIVE);
end;

Создание окна О Программе…

Многие приложения содержат диалоговые окна О Программе..., которые отображают информацию о продукте, такую, как название программы, версия, логотип, может включать в себя лицензионное соглашение, авторские права и т.п. Мы уже создали пункт меню О Программе. Чтобы создать диалоговое окно, нужно выполнить следующее: В Delphi выберите File -> New -> Other... Откроется окно New Items, на вкладке Forms выберите About Box.

Окно выбора формы About

Будет создана новая форма О Программе.... Измените ее по своему усмотрению:

Измененное окно О Программе...

Сохраните форму как About.pas. В раздел uses модуля Unit1 добавьте About.

В Action List дважды щелкните на пункте HelpAbout для того, чтобы создать событие для меню и запишите следующее:


procedure TForm1.HelpAboutExecute(Sender: TObject);
begin
  AboutBox.ShowModal;
end;

Форма О Программе будет отображаться модально, это значит, что пока Вы не закроетеthumbtd p alt=h3img class= эту форму, Вы не сможете работать с редактором.

И еще, в событии формы OnCreate нужно инициализировать переменные и настройки:


procedure TForm1.FormCreate(Sender: TObject);
begin
  Application.HelpFile := ExtractFilePath(Application.ExeName) + 'Help.hlp';
  FileName := 'Untitled.txt';
  StatusBar1.Panels[0].Text := FileName;
  RichEdit1.Clear;
end;

Сохраните проект.

Все! Текстовый редактор готов. Нажимайте клавишу F9, чтобы скомпилировать и запустить проект.


 

Комментарии   

 
0 #1 Molier 17.02.2016 18:36
Но можно и записать в коде, например:
StatusBar1.SimpleText:= ‘untitled.txt’

а как именно и где что то не получается (и в конце наверное ставится ; да?)
Цитировать
 
 
+1 #2 Serge 19.02.2016 12:19
например, сразу после создания файла.
Цитировать
 
 
+1 #3 Saundra 16.05.2017 02:58
Hello i am kavin, its my first occasion to commenting anywhere, when i read this article i thought i could also make comment
due to this good paragraph.
Цитировать
 

Добавить комментарий


Защитный код
Обновить