Spravce: Formátování, upřesnění title a subtitle

2026-01-26T11:16:59Z

Formátování, upřesnění title a subtitle

← Starší verze		Verze z 26. 1. 2026, 11:16
Řádka 2:		Řádka 2:

	== ListView ==		== ListView ==
−	* <code>ListView</code> slouží pro zobrazení dynamického seznamu položek, ~~který~~ lze skrolovat.	+	* <code>ListView</code> slouží pro zobrazení dynamického seznamu položek, kterým lze skrolovat.
	* Lze ho využít například pro zobrazení položek ze seznamu či pro položky, které přidáváme postupně.		* Lze ho využít například pro zobrazení položek ze seznamu či pro položky, které přidáváme postupně.

−	== ~~Zobrazení~~ seznamu ==	+	== Příklad zobrazení seznamu ==
	* Pro zobrazení seznamu <code>seznam</code> můžeme použít ListView:		* Pro zobrazení seznamu <code>seznam</code> můžeme použít ListView:
		+	List<Element> seznam = ...;
		+
	Expanded(		Expanded(
	child: ListView.builder(		child: ListView.builder(
Řádka 12:		Řádka 14:
	itemBuilder: (context, index) {		itemBuilder: (context, index) {
	return ListTile(		return ListTile(
−	title: Text('${_seznam[index].~~abc~~}'),	+	title: Text('${_seznam[index].nazev}'),
−	subtitle: Text('${_seznam[index].~~def~~}'),	+	subtitle: Text('${_seznam[index].popis}'),
	);		);
	},		},
Řádka 22:		Řádka 24:
	== Vytvoření ListView ==		== Vytvoření ListView ==

−	=== ListView(~~children: []~~) ===	+	=== ListView.builder() ===
−	* ~~Vhodné~~ pro ~~'''krátké statické~~ seznamy~~''' — nelze přidávat položky~~.	+	* Používá se pro delší nebo dynamické seznamy (nejčastější varianta).
		+	* Vytváří položky až když jsou potřeba (lepší výkon)

−	~~<code>~~	+	ListView.builder(
−	ListView(	+	itemCount: 10,
−	~~children~~: [	+	itemBuilder: (context, index) {
−	~~ListTile(title~~: ~~Text~~(~~'Položka 1'~~)),	+	return ListTile(
−	ListTile(title: Text('Položka 2')),	+	title: Text('Položka $index'),
−	~~ListTile(title: Text('Položka 3'~~)),	+	);
−	],	+	},
−	)	+	)
−	~~</code>~~	+

−	=== ListView~~.builder~~() ===	+	=== ListView(children: []) ===
−	* ~~Používá se~~ pro ~~'''delší nebo dynamické~~ seznamy~~''' (nejčastější varianta)~~.	+	* Vhodné pro krátké statické seznamy — nelze přidávat položky.
−	* Vytváří položky '''až když jsou potřeba''' (lepší výkon)	+

−	~~<code>~~	+	ListView(
−	ListView~~.builder~~(	+	children: [
−	~~itemCount~~: ~~10,~~	+	ListTile(title: Text('Položka 1')),
−	~~itemBuilder~~: (~~context, index~~) {	+	ListTile(title: Text('Položka 2')),
−	~~return~~ ListTile(	+	ListTile(title: Text('Položka 3')),
−	title: Text('Položka ~~$index~~'),	+	],
−	);	+	)
−	},	+
−	)	+
−	~~</code>~~	+


Řádka 56:		Řádka 54:

	; Vlastnosti <code>ListTile</code>:		; Vlastnosti <code>ListTile</code>:
−	* ~~'''~~leading~~'''~~ – ikona vlevo	+	* <code>title</code> – hlavní text (nadpis položky)
−	* ~~'''~~trailing~~'''~~ – ikona vpravo	+	* <code>subtitle</code> – doplňující popis položky
−	* ~~'''~~onTap~~'''~~ – reakce na kliknutí	+	* <code>leading</code> – ikona vlevo
		+	* <code>trailing</code> – ikona vpravo
		+	* <code>onTap</code> – reakce na kliknutí
		+
		+	; Příklad použití:

−	~~<code>~~	+	ListTile(
−	ListTile(	+	leading: Icon(Icons.person),
−	leading: Icon(Icons.person),	+	title: Text('Karel Dvořák'),
−	title: Text('~~Uživatel~~'),	+	subtitle: Text('místnost: 33'),
−	trailing: Icon(Icons.arrow_forward),	+	trailing: Icon(Icons.arrow_forward),
−	onTap: () {	+	onTap: () {
−	~~print('Klik!')~~;	+	_reakceNaKlik;
−	},	+	},
−	)	+	)
−	~~</code>~~	+

Spravce: Vytvoření základu stránky.

2026-01-26T09:37:17Z

Vytvoření základu stránky.

Nová stránka

[[Category:VSE]][[Category:Informatika]][[Category:Programování]][[Category:Flutter]]

== ListView ==
* <code>ListView</code> slouží pro zobrazení dynamického seznamu položek, který lze skrolovat.
* Lze ho využít například pro zobrazení položek ze seznamu či pro položky, které přidáváme postupně.

== Zobrazení seznamu ==
* Pro zobrazení seznamu <code>seznam</code> můžeme použít ListView:
Expanded(
child: ListView.builder(
itemCount: _seznam.length,
itemBuilder: (context, index) {
return ListTile(
title: Text('${_seznam[index].abc}'),
subtitle: Text('${_seznam[index].def}'),
);
},
),
),

== Vytvoření ListView ==

=== ListView(children: []) ===
* Vhodné pro '''krátké statické seznamy''' — nelze přidávat položky.

<code>
ListView(
children: [
ListTile(title: Text('Položka 1')),
ListTile(title: Text('Položka 2')),
ListTile(title: Text('Položka 3')),
],
)
</code>

=== ListView.builder() ===
* Používá se pro '''delší nebo dynamické seznamy''' (nejčastější varianta).
* Vytváří položky '''až když jsou potřeba''' (lepší výkon)

<code>
ListView.builder(
itemCount: 10,
itemBuilder: (context, index) {
return ListTile(
title: Text('Položka $index'),
);
},
)
</code>

== ListTile: položka seznamu ==

* Jednu položku dynamického seznamu reprezentuje widget <code>ListTile</code>

; Vlastnosti <code>ListTile</code>:
* '''leading''' – ikona vlevo
* '''trailing''' – ikona vpravo
* '''onTap''' – reakce na kliknutí

<code>
ListTile(
leading: Icon(Icons.person),
title: Text('Uživatel'),
trailing: Icon(Icons.arrow_forward),
onTap: () {
print('Klik!');
},
)
</code>

== Související stránky ==
* [[Flutter: Základní widgety]]
* [[Flutter: Kostra aplikace]]

Flutter: ListView - Historie editací

Spravce: Formátování, upřesnění title a subtitle

Spravce: Vytvoření základu stránky.