Flutter: Základní widgety - Historie editací

Spravce: /* Jednoduchý dialog */ Lépe struktorováno, přidány příklady dialogů, připraveno na budoucí osamostatnění.

2026-02-16T09:55:37Z

Jednoduchý dialog: Lépe struktorováno, přidány příklady dialogů, připraveno na budoucí osamostatnění.

← Starší verze		Verze z 16. 2. 2026, 09:55
Řádka 119:		Řádka 119:

	== Jednoduchý dialog ==		== Jednoduchý dialog ==
−	Pro ~~zobrazení~~ dialogu ~~si můžeme vytvořit~~ metodu:	+
−	Future<void> ~~displayDialog~~(String messageText) => showDialog<void>(	+	Pro vytvoření jednoduchého dialogu slouží třída <code>AlertDialog</code>.
		+	; Parametry konstruktoru <code>AlertDialog</code>
		+	title: const Text('Titulek dialogu')
		+	content: const Text('Zpráva dialogu...')
		+	actions: [ ''seznam akcí/tlačítek'' ]
		+
		+	; Příklad – Jednoduchý dialog s jedním tlačítkem
		+	AlertDialog(
		+	title: const Text('Skutečně smazat položku'),
		+	content: const Text('Soubor neobsahuje platná data!'),
		+	actions: [
		+	TextButton(
		+	onPressed: () => Navigator.pop(context),
		+	child: const Text('OK'),
		+	),
		+	]
		+	)
		+
		+	; Příklad – Potvrzovací dialog se dvěma tlačítky
		+	AlertDialog(
		+	title: const Text('Upozornění'),
		+	content: const Text('Skutečně chcete smazat položku XYZ?'),
		+	actions: [
		+	'''TextButton('''
		+	onPressed: () => {
		+	setState(() { ''_akceSmazSkutecne();'' };);
		+	_akceUloz();
		+	Navigator.pop(context);
		+	},
		+	child: const '''Text('Smaž'),'''
		+	'''),'''
		+	'''TextButton('''
		+	onPressed: () => Navigator.pop(context),
		+	child: const '''Text('Zrušit'),'''
		+	'''),'''
		+	]
		+	)
		+
		+	=== Vyvolání dialogu ===
		+
		+	; Metoda pro různá hlášení
		+
		+	Můžeme připravit metodu pro vyvolání obecného dialogu:
		+	Future<void> ukazHlaseni(String messageText) => showDialog<void>(
	context: context,		context: context,
	builder: (context) {		builder: (context) {
−	return AlertDialog(	+	return AlertDialog( ''...'' );
−	~~title: const Text~~('~~Chybně zadaná data:~~'),	+
−	~~content: Text(messageText),~~	+
−	~~actions: <Widget>[~~	+
−	~~TextButton(~~	+
−	~~onPressed: () {~~	+
−	~~Navigator~~.~~of(context)~~.~~pop();~~	+
−	},	+
−	~~child: const Text(~~'OK'),	+
−	),	+
−	],	+
−	);	+
	},		},
	);		);

	Metodu následně voláme:		Metodu následně voláme:
−	~~displayDialog~~('Text');	+	ukazHlaseni('Text');
		+
		+	; Volání přímo v kódu
		+
		+	Můžeme také dialog vytvořit a rovnou ho zavolat:
		+	showDialog(
		+	context: context,
		+	builder: (context) => AlertDialog( ''...'' ),
		+	)

Spravce: /* Textová pole */ Přidáno enable/readOnly/labelText

2026-01-26T17:35:29Z

Textová pole: Přidáno enable/readOnly/labelText

← Starší verze		Verze z 26. 1. 2026, 17:35
Řádka 24:		Řádka 24:
	TextField(		TextField(
	controller: _abcController,		controller: _abcController,
−	~~readOnly: true, // Pokud chcete pole pouze pro čtení~~
	decoration: const InputDecoration(		decoration: const InputDecoration(
	labelText: 'Nadpis pole – viditelný popisek:',		labelText: 'Nadpis pole – viditelný popisek:',
Řádka 30:		Řádka 29:
	keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty		keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty
	),		),
		+
		+	; Parametry widgetu
		+
		+	enabled:
		+	* Aktivní/zakázané textové pole.
		+	* Zakázané textové pole je šedivé a nejde do něj umístit kurzor.
		+
		+	readOnly:
		+	* Textové pole pouze pro čtení – ale není šedivé a lze do něj umístit kurzor
		+
		+	onChanged: (text) { ... }
		+	* Metoda, která se zavolá při změně obsahu tlačítka.
		+	* Metoda musí přijímat jako parametr text.
		+

	; Kontroler textového pole		; Kontroler textového pole
Řádka 43:		Řádka 56:

	; Nastavení vzhledu <code>InputDecoration</code>		; Nastavení vzhledu <code>InputDecoration</code>
		+
	contentPadding: EdgeInsets.all(20.0),		contentPadding: EdgeInsets.all(20.0),
	* Odsazení obsahu		* Odsazení obsahu
		+
	border: OutlineInputBorder(),		border: OutlineInputBorder(),
	* Ohraničení textového pole		* Ohraničení textového pole
		+
		+	labelText: 'text'
		+	* Popiska textového pole.
		+	* Když je pole prázdné, text je v poli.
		+	* Jakmile uživatel pole vyplní, popiska se přesune do rámečku textového pole.
		+
	hintText: 'Text'		hintText: 'Text'
	* Nápověda – co má uživatel zadat do pole.		* Nápověda – co má uživatel zadat do pole.

Spravce: /* Tlačítka */ Rozepsány podrobněji vlastnosti.

2026-01-26T17:31:07Z

Tlačítka: Rozepsány podrobněji vlastnosti.

← Starší verze		Verze z 26. 1. 2026, 17:31
Řádka 56:		Řádka 56:
	child: const Text('Popis tlačítka'),		child: const Text('Popis tlačítka'),
	),		),
		+
		+	; Vlastnosti:
		+
		+	onPressed:
		+	* Název metody, která se vyvolá při stisknutí tlačítka.
		+	* Obecně může být vložena akce i přímo
		+
		+	child:
		+	* Obsah tlačítka – popis, ikona, obrázek, ...

	== ListView ==		== ListView ==

Spravce: /* Odsazení */ Přidáno `const` před prvky, které se nemění.

2026-01-26T17:21:08Z

Odsazení: Přidáno `const` před prvky, které se nemění.

← Starší verze		Verze z 26. 1. 2026, 17:21
Řádka 66:		Řádka 66:
	Příklad použití:		Příklad použití:
	Column(		Column(
−	Text('Hello'),	+	const Text('Hello'),
−	Sizedbox(height: 10),	+	const Sizedbox(height: 10),
−	Text('World!'),	+	const Text('World!'),
	)		)

Spravce: /* Uspořádání stránky */ Přidáno Expanded(...)

2026-01-26T09:39:20Z

Uspořádání stránky: Přidáno Expanded(...)

← Starší verze		Verze z 26. 1. 2026, 09:39
Řádka 17:		Řádka 17:
	)		)
	* Všechny prvky budou odsazeny navzájem o 20 pixelů.		* Všechny prvky budou odsazeny navzájem o 20 pixelů.
		+
		+	Expanded( child: ... )
		+	* Tato část okna se bude roztahovat při zvětšování okna.

	== Textová pole ==		== Textová pole ==

Spravce: ListView přesunut do samostatné stránky Flutter: ListView.

2026-01-26T09:37:53Z

ListView přesunut do samostatné stránky Flutter: ListView.

← Starší verze		Verze z 26. 1. 2026, 09:37
Řádka 55:		Řádka 55:

	== ListView ==		== ListView ==
−	* Pro zobrazení seznamu ~~<code>seznam</code> můžeme použít ListView:~~	+	* Pro zobrazení dynamického seznamu prvků.
−	~~Expanded(~~	+	* Více viz samostatná stránka [[Flutter: ListView]].
−	~~child: ListView~~.~~builder(~~	+
−	~~itemCount: _seznam.length,~~	+
−	~~itemBuilder: (context, index) {~~	+
−	~~return ListTile(~~	+
−	~~title: Text('${_seznam~~[~~index].abc}'),~~	+
−	~~subtitle~~: ~~Text('${_seznam[index~~].~~def}'),~~	+
−	);	+
−	},	+
−	),	+
−	),	+

	== Odsazení ==		== Odsazení ==

Spravce: /* Uspořádání stránky */ Přidáno `Padding`, doplněny komentáře.

2026-01-16T05:57:41Z

Uspořádání stránky: Přidáno `Padding`, doplněny komentáře.

← Starší verze		Verze z 16. 1. 2026, 05:57
Řádka 4:		Řádka 4:

	Center( child: ... )		Center( child: ... )
		+	* Vycentruje obsah uvnitř widgetu.

	Column(		Column(
Řádka 9:		Řádka 10:
	children: <Widget>[ ... ]		children: <Widget>[ ... ]
	)		)
		+	* Vloží blok více prvků poskládaných pod sebe.
		+
		+	Padding(
		+	padding: EdgeInsetsGeometry.all(20),
		+	child: ...
		+	)
		+	* Všechny prvky budou odsazeny navzájem o 20 pixelů.

	== Textová pole ==		== Textová pole ==

Spravce: Přidán SizedBox pro odsazení widgetů od sebe.

2025-12-15T12:12:17Z

Přidán SizedBox pro odsazení widgetů od sebe.

← Starší verze		Verze z 15. 12. 2025, 12:12
Řádka 60:		Řádka 60:
	),		),

		+	== Odsazení ==
		+	SizedBox(height: 10),
		+
		+	Příklad použití:
		+	Column(
		+	Text('Hello'),
		+	Sizedbox(height: 10),
		+	Text('World!'),
		+	)

	== Textová popiska ==		== Textová popiska ==

Spravce: /* Textová pole */ Přidána informace o uvolňování kontroleru přes dispose()

2025-12-14T18:35:56Z

Textová pole: Přidána informace o uvolňování kontroleru přes dispose()

← Starší verze		Verze z 14. 12. 2025, 18:35
Řádka 16:		Řádka 16:
	decoration: const InputDecoration(		decoration: const InputDecoration(
	labelText: 'Nadpis pole – viditelný popisek:',		labelText: 'Nadpis pole – viditelný popisek:',
−	~~hintText: 'Nápověda – obsah pole, dokud uživatel nezadá vlastní text',~~
	),		),
	keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty		keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty
Řádka 23:		Řádka 22:
	; Kontroler textového pole		; Kontroler textového pole
	final TextEditingController _abcController = TextEditingController();		final TextEditingController _abcController = TextEditingController();
		+	* Pro práci s obsahem textového pole slouží <code>TextEditingController</code>.

−	~~; Zpracování obsahu textového pole~~
	final double totalPrice = double.parse(parsedValue = _abcController.text.trim());		final double totalPrice = double.parse(parsedValue = _abcController.text.trim());
		+	* Přístup k obsahu textového pole zprostředkovává atribut <code>.text</code>.
	* Obdobně lze <code>int.parse(...)</code>.		* Obdobně lze <code>int.parse(...)</code>.

−	; ~~Další možnosti~~ <code>InputDecoration</code>:	+	_abcController.dispose()
		+	* Při uvolňování paměti by měly být řádně uvolněny i kontrolery metodou <code>dispose()</code>.
		+
		+	; Nastavení vzhledu <code>InputDecoration</code>
	contentPadding: EdgeInsets.all(20.0),		contentPadding: EdgeInsets.all(20.0),
	* Odsazení obsahu		* Odsazení obsahu
Řádka 34:		Řádka 37:
	* Ohraničení textového pole		* Ohraničení textového pole
	hintText: 'Text'		hintText: 'Text'
−	* ~~Nahrazuje <code>labelText</code>, ale po~~ zadání textu do pole zmizí.	+	* Nápověda – co má uživatel zadat do pole.
		+	* Po zadání textu do pole text zmizí.

	== Tlačítka ==		== Tlačítka ==

Spravce: Doplněny hintText a readOnly do popisu TextField.

2025-12-14T18:24:54Z

Doplněny hintText a readOnly do popisu TextField.

← Starší verze		Verze z 14. 12. 2025, 18:24
Řádka 13:		Řádka 13:
	TextField(		TextField(
	controller: _abcController,		controller: _abcController,
		+	readOnly: true, // Pokud chcete pole pouze pro čtení
	decoration: const InputDecoration(		decoration: const InputDecoration(
−	labelText: '~~Popis – co zadávat~~',	+	labelText: 'Nadpis pole – viditelný popisek:',
		+	hintText: 'Nápověda – obsah pole, dokud uživatel nezadá vlastní text',
	),		),
	keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty		keyboardType: TextInputType.number, // Pokud chceme omezit vstup na číselné hodnoty