2. Пишем детскую программку под Android: основа

Продолжаем писать программку для детей под Android (требования мы сформулировали в первом посте).

Начнём с того, что сделаем совсем простой проект – программку, которая умеет листать картинки при нажатии на кнопку. Картинки запакуем в ресурсы программы.

Создаём новый проект: Firemonkey Mobile application –> Blank application

Разрешения

Отключим ненужные permissions. Так как по умолчанию включено слишком много всего.

Project –> Options –> Uses permissions. (Или через Help Insight: Ctrl+. –> ввести Permission + Enter, но это как-то странно работает). Сверху выберем All configurations Android Platform, так как список Permissions доступен только для Android платформы.

Как вы видите на скриншоте жирным false отмечены те настройки, у которых значение отличается от значения по умолчанию (они были включены, и мы их отключили).

Из всех разрешений включим только:

• Read Phone State – нужен для получения уникального идентификатора устройства
• Read External Storage – для чтения SdCard
• Write External Storage – для записи на SdCard

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

Сохраним проект (Save all) и зафиксируем изменения в системе контроля версий.

Добавим ресурсы

В папке с проектом сделаем новую папку resources. Здесь мы будем хранить rc файлы. В папке resources создадим подпапку images – в ней будем хранить картинки.

Картинки возьмём с сайта OpenClipArt.org – там лицензия Public Domain. Так как проект у нас учебный и открытый, то поверим им на слово и не будем искать настоящих авторов. (а вот для коммерческой разработки, картинки лучше всего покупать в каком-нибудь проверенном месте).

Для начала возьмём с этого сайта 4 картинки

• lemmling_Cartoon_cat.png
• lemmling_Cartoon_goat.png
• lemmling_Cartoon_owl.png
• lemmling_Cartoon_sheep.png

Добавим в проект новый .RC файл:

• Ctrl+. для активации IDE insight
• ввести Text file + Enter –> появи
• в открывшемся диалоге: Alt+a, ввести .rc и нажать Enter

Если хотите можете добавлять эти файлы и через диалог Resources and Images.

Добавим наши картинки в animals.rc

MyImage_1 RCDATA "resources\\images\\lemmling_Cartoon_cat.png"
MyImage_2 RCDATA "resources\\images\\lemmling_Cartoon_goat.png"
MyImage_3 RCDATA "resources\\images\\lemmling_Cartoon_owl.png"
MyImage_4 RCDATA "resources\\images\\lemmling_Cartoon_sheep.png"

Теперь при компиляции проекта файл с ресурсами animals.rc будет автоматически компилироваться в animals.res файл.

Код

Для загрузки картинок из ресурсов создадим простенький класс (TImageLoader) .

type
  TImageLoader = class
  strict private
  const
    cMinPictureId = 1;
    cMaxPictureId = 4;
  var
    FCurrentImgIndex: Integer;
  public
    procedure LoadPic(const aBitmap: TBitmap);
    procedure SetNextPic;
    procedure SetPrevPic;
  end;

Реализацию можно посмотреть на github-е.

GUI

Для начала, чтобы упростить сделаем всё на одной форме.

На форму бросаем панель с Align = alClient (так потом будет проще если что добавить другой контрол с другим Align-ом).

На панель кидаем 2 кнопки (TSpeedButton):

• одну назовём btnPrev с Align alLeft
• другую кнопку назовём btnNext и установим выравнивание по правому краю (Align alRight)

Кстати, мне так и не удалось добиться того, чтобы в дизайнере SpeedButton кнопки растянулись на всю высоту панели, но в runtime они растягиваются как положено.

Интересно, почему все tutorial-ы для мобильной разработки рекомендуют использовать именно TSpeedButton вместо TButton, который умеет не только всё то же самое, что и TSpeedButton но больше. Я так толком и не понял. Есть идеи?

В обработчиках нажатия кнопок будут вызываться методы TImageLoader SetNextPic, SetPrevPic и LoadPic соответственно.

Код

Весь код доступен на github-е: релиз post_2

Страничка проекта: https://github.com/tdelphi/dog-said-meow