1 of 37

Tvorba mobilních aplikací pro geografická data III.

Mgr. Michal Jakl

LS 2025

2 of 37

Obsah lekce

  1. Verzovací systémy
  2. GIT
  3. GIThub
  4. Clone projektu z GIThubu
  5. Práce s kódem (Android)
  6. Úprava a doplnění kódu (Android)
  7. Export aplikace (Android)

Praktické cvičení: Tvorba a úpravy mobilní mapové aplikace

3 of 37

  1. Verzovací systémy

= Nástroje, které slouží ke sledování změn v kódu a usnadňují spolupráci mezi vývojáři.

  • Verzovací systémy jsou klíčovým nástrojem moderního vývoje.

Hlavní výhody:

  • Historie změn – možnost vrátit se k předchozí verzi
  • Paralelní vývoj – práce více vývojářů na stejném projektu
  • Zálohování a sdílení kódu

Typy verzovacích systémů:

  • Centralizované systémy (CVCS):
    • Příklad: SVN (Subversion)
    • Všechny změny jsou uloženy na jednom centrálním serveru
  • Distribuované systémy (DVCS):
    • Příklad: Git, Mercurial
    • Každý vývojář má kompletní kopii repozitáře, včetně historie
    • Výhody distribuovaných systémů:
      • Rychlejší operace, práce offline
      • Flexibilnější spolupráce

4 of 37

2. GIT

  • Distribuovaný verzovací systém
  • Vytvořen Linusem Torvaldsem pro Linuxové jádro (2005)
  • Git jako distribuovaný systém nabízí flexibilitu a rychlost

Klíčové vlastnosti:

  • Snapshotový model – každý commit je snímkem celého projektu
  • Branching a merging – snadné vytváření větví pro experimentování
  • Rychlost a efektivita díky lokálním operacím

Praktické příkazy:

  • git init, git clone, git add, git commit, git branch, git merge

Zajímavost:

  • Git byl původně vyvinut s důrazem na bezpečnost a integritu dat, což je dodnes jeho jednou z největších předností.

5 of 37

2. GIT - pojmy I.

  • Commit
    • Commit je operace, která uloží změny, které jste provedli ve svém lokálním repozitáři, jako „snapshot“ aktuálního stavu kódu.
    • K čemu slouží:
      • Umožňuje sledovat historii změn.
      • Každý commit má zprávu, která popisuje, co bylo změněno, což usnadňuje orientaci v historii projektu.
    • Prakticky: Příkaz git commit uloží všechny připravené změny (přidané pomocí git add) a vytvoří nový záznam v historii repozitáře.

6 of 37

2. GIT - pojmy II.

  • Pull
    • Co to je: Pull je operace, která stáhne nejnovější změny z remote repozitáře (například z GitHubu) a sloučí je s vaším lokálním repozitářem.
    • K čemu slouží:
      • Udržuje váš lokální repozitář aktuální.
      • Zajišťuje, že máte všechny změny provedené ostatními spolupracovníky.
    • Prakticky: Příkaz git pull kombinuje operace git fetch (stažení změn) a git merge (sloučení změn do aktuální větve).

7 of 37

2. GIT - pojmy III.

  • Push
    • Co to je: Push je operace, která odesílá vaše lokální commity do remote repozitáře, čímž aktualizuje vzdálenou verzi projektu.
    • K čemu slouží:
      • Sdílí vaše změny s ostatními členy týmu.
      • Umožňuje zálohovat vaši práci na serveru (např. GitHub).
    • Prakticky: Příkaz git push odešle vaše lokální commity do zvolené větve remote repozitáře

8 of 37

3. GIThub

  • Online platforma pro hostování Git repozitářů
  • GitHub usnadňuje spolupráci, sdílení a správu projektů

Hlavní funkce:

  • Sdílení a spolupráce na kódu
  • Pull requesty – revize a slučování kódu
  • Issues a Wiki – nástroje pro správu projektů

Další funkce:

  • GitHub Actions – automatizace pracovních postupů
  • GitHub Pages – hostování statických webů

Zajímavost:

  • GitHub je největší hostitel open-source projektů, který umožňuje milionům vývojářů spolupracovat po celém světě.

9 of 37

3. GIThub - tipy

  • Práce s větvemi:
    • Vždy vytvářejte nové větve pro nové funkce nebo opravy chyb
    • Pravidelně slučujte (merge) změny a řešte konflikty

  • Commit zprávy:
    • Pište výstižné zprávy – pomáhají pochopit historii změn

  • Collaborace:
    • Využívejte pull requesty pro revize kódu
    • Komunikujte a využívejte komentáře přímo v GitHubu

  • Zajímavé statistiky:
    • GitHub hostuje více než 100 milionů repozitářů
    • Více než 40 milionů vývojářů používá Git a GitHub k denní spolupráci

10 of 37

11 of 37

4. Clone projektu z GIThubu

  1. Získání URL repozitáře:
    1. Na GitHubu otevřete stránku projektu a zkopírujte HTTPS URL (například https://github.com/uzivatel/Projekt.git).
  2. Otevření Android Studia:
    • Spusťte Android Studio. Pokud máte otevřený jiný projekt, můžete ho zavřít (File → Close Project).
  3. Klonování projektu:
    • Klikněte na File → New → Project from Version Control…
    • V nabídce vyberte Git.
    • Do pole URL vložte zkopírovanou adresu repozitáře.
    • Vyberte cílovou složku, kam se má projekt uložit, a potvrďte tlačítkem Clone.
  4. Načtení projektu:
    • Android Studio automaticky načte projekt, stáhne potřebné závislosti a synchronizuje Gradle. Pokud se objeví výzva k importu projektu jako Gradle projekt, potvrďte.
  5. Spuštění projektu:
    • Po úspěšném načtení projektu můžete vybrat emulátor nebo připojené zařízení a spustit aplikaci pomocí zeleného tlačítka Run.

12 of 37

4. Clone projektu z GIThubu

13 of 37

5. Práce s kódem (Android)

Ukázová aplikace MyMapApp je ukázkovým řešením pro tvorbu mapové aplikace v Androidu pomocí knihovny MapLibre. Cílem je demonstrovat, jak:

  • Načíst a zobrazit mapu pomocí knihovny MapLibre
  • Použít vlastní mapové podklady
  • Umožnit uživateli přidávat markery na mapu pomocí dlouhého stisku
  • Zobrazit dialog pro zadání názvu markeru
  • Ukládat přidané markery do lokální paměti (SharedPreferences) tak, aby po restartu aplikace zůstaly na mapě

14 of 37

5. Práce s kódem (Android) - struktura projektu

15 of 37

5. Práce s kódem (Android) - build.gradle

V tomto souboru definujeme konfiguraci aplikace, verzi SDK, název balíčku, a především závislosti a repozitáře.

Klíčové body:

  • Namespace a compileSdk
    • Uvádíme, že aplikace cílí na SDK verzi 34 a definuje vlastní namespace.
  • Závislosti
    • MapLibre SDK: Poskytuje funkce pro zobrazení mapy a práci s mapovými prvky.
    • Gson: Používáme pro převod seznamu markerů do JSON formátu a zpět, což umožňuje ukládat data do SharedPreferences.
  • AppCompat
    • Zajišťuje kompatibilitu aplikace se staršími verzemi Androidu a poskytuje moderní komponenty.

16 of 37

5. Práce s kódem (Android) - AndroidManifest.xml

Manifest definuje základní konfiguraci aplikace, jako je název, povolení, aktivita a téma. V našem případě používáme téma definované v knihovně AppCompat.

17 of 37

5. Práce s kódem (Android) - activity_main.xml

V tomto souboru definujeme, co se zobrazí na obrazovce. Používáme zde jediný prvek – MapView z MapLibre, který bude zobrazovat mapu.

18 of 37

5. Práce s kódem (Android) - osm_style.json

Složka assets se nachází v adresáři app/src/main/. Do ní umístíme soubor osm_style.json, který definuje vlastní styl mapy s využitím dlaždic OpenStreetMap. Tento soubor zajistí, že se jako podkladová mapa použijí dlaždice z OpenStreetMap.

19 of 37

5. Práce s kódem (Android) - MarkerData.java

Pro ukládání dat o jednotlivých markerech (souřadnice a název) vytvoříme jednoduchou třídu. Tato třída se využije pro ukládání markerů do seznamu a následné přeměně na JSON pomocí knihovny Gson.

20 of 37

5. Práce s kódem (Android) - MainActivity.java I.

Hlavní logika aplikace se nachází v MainActivity.java. Zde jsou klíčové body:

  • Inicializace mapy:
    • MapLibre.getInstance(this): Inicializuje MapLibre.
      • Open-source knihovna pro zobrazení map, která nevyžaduje API klíč a využívá data z OpenStreetMap.
    • Inflace layoutu a inicializace MapView: Načtení layoutu a získání instance MapView.
    • Načtení stylu: MapLibre načte styl mapy z JSON souboru umístěného v assets.

  • Nastavení mapy:
    • Po načtení stylu se nastaví počáteční pozice (např. na Prahu).

21 of 37

5. Práce s kódem (Android) - MainActivity.java II.

  • Přidávání markerů:
    • Long Click Listener: Při dlouhém stisku na mapě se zavolá metoda showAddMarkerDialog(), která zobrazí dialog.
    • Dialog pro zadání názvu markeru: Uživatel zadá název markeru a po potvrzení se marker přidá na mapu.
    • Ukládání markerů: Data o markeru se uloží do seznamu a persistují se do SharedPreferences pomocí knihovny Gson. To zajišťuje, že po ukončení a opětovném spuštění aplikace se uložené markery opět načtou a zobrazí.

  • Životní cyklus MapView:
    • Metody onStart(), onResume(), onPause(), onStop(), onDestroy(), onLowMemory() a onSaveInstanceState() zajišťují správnou správu zdrojů MapView při změnách stavu aktivity.

22 of 37

6. Úprava a doplnění kódu (Android) - změna ikony

  1. Otevřete Image Asset Studio:
    1. V Android Studiu klikněte na File > New > Image Asset.
  2. Vyberte typ ikony:
    • V dialogu vyberte typ ikony (například Launcher Icons (Adaptive and Legacy)).
  3. Nastavte zdrojový obrázek:
    • V části Asset Type vyberte obrázek, který chcete použít jako ikonu. Můžete nastavit například obrázek z vašeho počítače.
  4. Konfigurujte ikonu:
    • Můžete upravit náhled, změnit tvar (pro adaptivní ikony) a přizpůsobit další vlastnosti.
  5. Vygenerujte ikony:
    • Klikněte na Next a poté Finish. Studio automaticky vygeneruje ikony do složek res/mipmap-*.
  6. Nastavení android:icon v Manifest.xml

23 of 37

6. Úprava a doplnění kódu (Android) - změna ikony

24 of 37

6. Úprava a doplnění kódu (Android) - přejmenování aplikace

  • Otevřete soubor s řetězci:
    • Otevřete soubor app/src/main/res/values/strings.xml.
  • Upravte hodnotu řetězce pro název aplikace:
    • Najděte řádek, který vypadá například takto:

<string name="app_name">MyMapApp</string>

    • Změňte hodnotu na požadovaný název, např.:

<string name="app_name">Moje Mapová Aplikace</string>

  • Ujistěte se, že v AndroidManifest.xml je odkaz na tento řetězec:
    • V souboru AndroidManifest.xml by měla být položka:

android:label="@string/app_name"

    • Po změně řetězce se v nabídce zařízení zobrazí nový název aplikace.

25 of 37

6. Úprava a doplnění kódu (Android) - změna zdroje mapových dlaždic

  • Vytvoření nového stylu v assets, např. styl2.json a jeho nasměrování na zdroj mapových dlaždic

https://api.mapy.cz/v1/maptiles/outdoor/256/{z}/{x}/{y}?apikey=a7-5mTjgt8bBnirZ4BSu7lbA3PrgjowwCi3-OQvrhVI

  • Úprava layoutu (activity_main.xml)
    • Přepište svůj layout tak, aby kromě MapView obsahoval také tlačítko.

  • Aktualizace MainActivity.java

26 of 37

6. Úprava a doplnění kódu (Android) - změna zdroje mapových dlaždic

27 of 37

6. Úprava a doplnění kódu (Android) - změna zdroje mapových dlaždic

28 of 37

6. Úprava a doplnění kódu (Android) - aktivita pro seznam markerů

  1. Úprava layoutu (activity_main.xml). Přidejte do layoutu další tlačítko.

<Button

android:id="@+id/btnShowMarkers"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Zobrazit markery"

android:layout_margin="16dp"

android:layout_gravity="bottom|end" />

29 of 37

6. Úprava a doplnění kódu (Android) - aktivita pro seznam markerů

2. Vytvoření nové aktivity – MarkerListActivity (activity_marker_list.xml). V adresáři app/src/main/res/layout/ vytvořte soubor activity_marker_list.xml:

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

android:padding="16dp">

<ListView

android:id="@+id/listViewMarkers"

android:layout_width="match_parent"

android:layout_height="wrap_content"/>

</LinearLayout>

30 of 37

6. Úprava a doplnění kódu (Android) - aktivita pro seznam markerů

3. Kód MarkerListActivity.java. Vytvořte nový soubor MarkerListActivity.java (v balíčku com.example.mymapapp):

package com.example.mymapapp;

import android.os.Bundle;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import androidx.appcompat.app.AppCompatActivity;

import com.google.gson.Gson;

import com.google.gson.reflect.TypeToken;

import java.lang.reflect.Type;

import java.util.List;

public class MarkerListActivity extends AppCompatActivity {

private ListView listView;

private List<MarkerData> markerDataList;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_marker_list);

listView = findViewById(R.id.listViewMarkers);

// Přečteme data z Intentu – předáme markerDataList jako JSON

String markerJson = getIntent().getStringExtra("marker_list");

if (markerJson != null) {

Gson gson = new Gson();

Type listType = new TypeToken<List<MarkerData>>(){}.getType();

markerDataList = gson.fromJson(markerJson, listType);

}

// Připravíme jednoduchý adaptér pro zobrazení markerů ve formátu "Název (lat, lng)"

if (markerDataList != null && !markerDataList.isEmpty()) {

String[] markerStrings = new String[markerDataList.size()];

for (int i = 0; i < markerDataList.size(); i++) {

MarkerData data = markerDataList.get(i);

markerStrings[i] = data.title + " (" + data.latitude + ", " + data.longitude + ")";

}

ArrayAdapter<String> adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, markerStrings);

listView.setAdapter(adapter);

}

}

}

31 of 37

6. Úprava a doplnění kódu (Android) - aktivita pro seznam markerů

4. Úprava MainActivity.java. Do stávající MainActivity přidejte obsluhu tlačítka, které otevře MarkerListActivity.

// Na začátku onCreate() v MainActivity:

Button btnShowMarkers = findViewById(R.id.btnShowMarkers);

btnShowMarkers.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

// Pomocí Gson převedeme markerDataList do JSON řetězce a předáme ho pomocí Intentu

Gson gson = new Gson();

String markerJson = gson.toJson(markerDataList);

Intent intent = new Intent(MainActivity.this, MarkerListActivity.class);

intent.putExtra("marker_list", markerJson);

startActivity(intent);

}

});

32 of 37

6. Úprava a doplnění kódu (Android) - aktivita pro seznam markerů

5. Registrace MarkerListActivity v AndroidManifest.xml. Do souboru AndroidManifest.xml přidejte novou aktivitu:

<application

... >

<activity android:name=".MainActivity" ... />

<activity android:name=".MarkerListActivity" />

</application>

33 of 37

6. Úprava a doplnění kódu (Android) - samostatná práce

Upravte seznam markerů tak, aby vypadal co nejpodobněji uvedenému vzoru

34 of 37

7. Export aplikace (Android) - debug vs. release

Debug Build:

  • Vytváří se během vývoje.
  • Obsahuje ladící informace (logy, debug symboly).
  • Podepsán automatickým debug klíčem (neužívat v produkci).
  • Umožňuje rychlý cyklus vývoje, ale není vhodný pro distribuci.

Podepsaný APK:

  • Vytváří se pro produkční nasazení.
  • Podepsán vlastním (soukromým) klíčem, který zaručuje integritu a identitu vydavatele.
  • Odstraňuje debug informace a optimalizuje kód.
  • Nutnost pro distribuci v Google Play Store.

App Bundle:

  • Moderní a efektivní řešení pro distribuci přes Google Play
  • Zmenšuje velikost stahovaného souboru.

35 of 37

7. Export aplikace (Android) - APK vs. App Bundle

APK (Android Package):

  • Jednotný balíček obsahující veškeré zdroje a kód.
  • Velikost souboru může být vyšší, protože obsahuje vše pro všechny konfigurace zařízení.
  • Distribuován přímo jako finální instalátor.

Android App Bundle (AAB):

  • Novější formát balíčku (oficiálně podporován Google Play od 2021).
  • Umožňuje Google Play generovat a distribuovat optimalizované APK pro konkrétní zařízení (tzv. „Dynamic Delivery“).
  • Výhody:
    • Menší velikost staženého souboru pro uživatele.
    • Automatická optimalizace pro různé architektury, jazyky a rozlišení.
  • Nevýhody:
    • Pro distribuci mimo Google Play (např. interní distribuce) je potřeba generovat APK ručně.

36 of 37

7. Export aplikace (Android) - postup

Debug Build:

  • Build → Run - pro rychlé testování
  • Debug build se automaticky generuje pro interní ladění

Podepsaný APK:

  • Build → Generate Signed Bundle/APK
  • Volba mezi APK a App Bundle
  • Konfigurace podpisu:
    • Vytvoření nebo použití existujícího klíče
    • Nastavení aliasu, hesla a umístění keystore

Export App Bundle:

  • Volba „Android App Bundle“ při generování
  • Výstupní soubor .aab se nahrává do Google Play Console, kde se automaticky vytvoří a distribuují optimalizované APK

37 of 37

Děkuji za pozornost a těším se příště!��Prostor pro zpětnou vazbu

mail@mjakl.cz

Tel. 608 544 839

Web: mjakl.cz

Telegram: t.me/mjakl_cz