Ga naar hoofdinhoud

Lists

Open in ChatGPT
informatie

Deze sectie beschrijft de gemeenschappelijke functies van alle lijstcomponenten en is geen klasse die rechtstreeks kan worden geïnstantieerd of gebruikt.

Er zijn drie soorten lijsten beschikbaar voor gebruik binnen uw apps: ListBox, ChoiceBox en ComboBox. Deze componenten tonen allemaal een lijst van sleutel-waarde-items en bieden methoden om items binnen de lijst toe te voegen, te verwijderen, te selecteren en te beheren.

Deze pagina beschrijft de gedeelde functies en het gedrag van alle lijstcomponenten, terwijl specifieke details voor elk op hun respectieve pagina's worden behandeld.

Gebruik van ListItem​

Lijstcomponenten zijn samengesteld uit ListItem objecten, die individuele items binnen een lijst vertegenwoordigen. Elke ListItem is geassocieerd met een unieke sleutel en weergavetekst. Belangrijke functies van de ListItem klasse zijn onder andere:

  • Een ListItem encapsuleert een unieke sleutel Object en een tekst String om weer te geven binnen de lijstcomponent.
  • U kunt een ListItem construeren door een sleutel en tekst op te geven, of alleen de tekst op te geven zodat een willekeurige sleutel wordt gegenereerd.

Beheren van ListItem objecten met de API​

De verschillende Lijstcomponenten bieden verschillende methoden voor het beheren van de lijst met items en het behouden van een consistente status tussen de lijst en de client. Door deze methoden te gebruiken, kunt u de items binnen de lijst effectief beheren. De API stelt u in staat om met de lijst te communiceren en deze aan te passen om aan de vereisten van uw app te voldoen.

Items toevoegen​

tip

Om de prestaties te optimaliseren, is het efficiënter om een Lijst van ListItem objecten eerst te maken in plaats van elke keer dat u de add() methode gebruikt een server-naar-client bericht te triggers. Zodra u deze lijst heeft, kunt u ze allemaal tegelijk toevoegen met de insert(int index, List<ListItem> items) methode. Deze benadering vermindert de communicatie tussen server en client, waardoor de algehele efficiëntie wordt verhoogd. Voor gedetailleerde richtlijnen hierover en andere best practices in de webforJ-architectuur, raadpleegt u Client/Server Interaction.

Items verwijderen​

Items selecteren​

Alle lijsttypen implementeren de SelectableList interface. Deze interface biedt verschillende manieren om de huidige ListItem te selecteren.

Met een gegeven ListItem​

select(ListItem item) neemt een ListItem als parameter om te selecteren.

List demoList = new List();
ListItem demoItem = new ListItem("demo","Demo Item");
demoList.add(demoItem);
demoList.select(demoItem);

Met een gegeven sleutel van een ListItem​

selectKey(Object key) neemt een sleutel naar een ListItem als parameter om te selecteren.

List demoList = new List();
demoList.add("demo","Demo Item");
demoList.selectKey("demo");

Met een gegeven index van een ListItem​

selectIndex(int index) neemt een index naar een ListItem als parameter om te selecteren.

List demoList = new List();
demoList.add("demo","Demo Item");
demoList.selectKey(0);

Andere lijstbewerkingen​

  • Toegang tot en bijwerken van items:

  • Informatie over de lijst ophalen:

    • U kunt de grootte van de lijst ophalen met de size() methode.
    • Om te controleren of de lijst leeg is, gebruikt u de isEmpty() methode.

Lijsten doorlopen​

Alle Lijstcomponenten implementeren de Java Iteratable interface, die een efficiënte en intuïtieve manier biedt om door de inhoud van een lijst te itereren. Met deze interface kunt u eenvoudig door elk ListItem lopen, waardoor het eenvoudig wordt om toegang te krijgen, te modificeren of acties uit te voeren op elk item met minimale inspanning. De Iterable interface is een standaard patroon van de Java-taal, waardoor uw code vertrouwd en onderhoudbaar is voor elke Java-ontwikkelaar.

De onderstaande code laat twee gemakkelijke manieren zien om door een lijst te itereren:

list.forEach(item -> {
   item.setText("Modified: " + item.getText());
});

for (ListItem item : list) {
   item.setText("Modified2: " + item.getText());
}

Gedeelde lijst eigenschappen​

Label​

Alle Lijstcomponenten kunnen een label worden toegewezen, dat een beschrijvende tekst of titel is die aan de component is gekoppeld. Labels bieden een korte uitleg of aanwijzing om gebruikers te helpen het doel of de verwachte selectie voor die specifieke lijst te begrijpen. Naast hun belang voor de bruikbaarheid, spelen lijstlabels ook een cruciale rol in toegankelijkheid, waardoor schermlezers en ondersteunende technologieën nauwkeurige informatie kunnen geven en de navigatie met het toetsenbord kunnen vergemakkelijken.

Helper tekst​

Elke Lijstcomponent kan helpertekst onder de lijst weergeven met behulp van de setHelperText() methode. Deze helpertekst biedt aanvullende context of uitleg over de beschikbare opties, zodat gebruikers de nodige informatie hebben om weloverwogen keuzes te maken.

Horizontale uitlijning​

Alle lijstcomponenten implementeren de HasHorizontalAlignment interface, waarmee u controle hebt over hoe tekst en inhoud binnen de component zijn uitgelijnd.

Gebruik de setHorizontalAlignment() methode om de uitlijning in te stellen:

  • HorizontalAlignment.LEFT (standaard)
  • HorizontalAlignment.MIDDLE
  • HorizontalAlignment.RIGHT
ListBox<String> listBox = new ListBox<>();
listBox.setHorizontalAlignment(HorizontalAlignment.LEFT);

Om de huidige uitlijning op te halen:

HorizontalAlignment alignment = listBox.getHorizontalAlignment();

Expansies​

Alle lijstcomponenten in webforJ implementeren ook de HasExpanse interface, waarmee u de algehele grootte en visuele impact van de component kunt aanpassen. Dit is nuttig voor het aanpassen van de component aan verschillende UI-contexten, zoals formulieren, dialoogvensters, zijbalken, enz.

Gebruik de setExpanse() methode om het expansieniveau in te stellen. Opties zijn onder andere:

  • Expanse.NONE
  • Expanse.XSMALL
  • Expanse.SMALL
  • Expanse.MEDIUM (standaard)
  • Expanse.LARGE
  • Expanse.XLARGE
ListBox<String> listBox = new ListBox<>();
listBox.setExpanse(Expanse.LARGE);

U kunt de huidige instelling ophalen met:

Expanse current = listBox.getExpanse();

Onderwerpen​

📄️ ComboBox

De ComboBox component is een interface-element dat is ontworpen om gebruikers een lijst met opties of keuzes te presenteren, evenals een veld voor het invoeren van hun eigen aangepaste waarden. Gebruikers kunnen een enkele optie uit deze lijst selecteren, doorgaans door op de ComboBox te klikken, wat de weergave van een dropdown-lijst met beschikbare keuzes activeert, of een aangepaste waarde intypen. Gebruikers kunnen ook met de pijltoetsen interactie hebben met de ComboBox. Wanneer een gebruiker een keuze maakt, wordt de gekozen optie in de ComboBox weergegeven.