Sliders

A csúszka olyan vezérlő, amely lehetővé teszi, hogy a felhasználó válasszon egy értéktartományból úgy, hogy egy hüvelykujj-vezérlőt mozgat egy sáv mentén.

Ez a megfelelő vezérlő?

Használjon csúszkát, ha azt szeretné, hogy a felhasználók definiált, összefüggő értékeket (például hangerőt vagy fényerőt) vagy különálló értéktartományt (például képernyőfelbontási beállításokat) állítsanak be.

A csúszka akkor jó választás, ha tudja, hogy a felhasználók relatív mennyiségként, nem numerikus értékként tekintenek az értékre. A felhasználók például arra gondolnak, hogy a hangerőt alacsonyra vagy közepesre állítják, nem pedig arra, hogy 2-es vagy 5-ös értékre állítják be.

Ne használjon csúszkát bináris beállításokhoz. Ehelyett használjon billenőkapcsolót.

Az alábbiakban néhány további tényezőt érdemes figyelembe venni, amikor eldönti, hogy használ-e csúszkát:

• A beállítás relatív mennyiségnek tűnik? Ha nem, használja a(z) választógombokat, vagy a(z) listamezőt.
• A beállítás pontos, ismert számérték? Ha igen, használjon numerikus szövegmezőt.
• A felhasználók azonnali visszajelzést kaphatnak a módosítások beállításának hatásáról? Ha igen, használjon csúszkát. A felhasználók például egyszerűbben választhatják ki a színeket, ha azonnal látják az árnyalat, a telítettség vagy a fényesség értékeinek változásainak hatását.
• A beállítás négy vagy több értéktartományt tartalmaz? Ha nem, akkor használja a választógombokat.
• Módosíthatja a felhasználó az értéket? A csúszkák felhasználói beavatkozásra használhatók. Ha egy felhasználó nem tudja módosítani az értéket, használjon csak olvasható szöveget.

Ha egy csúszka és egy numerikus szövegdoboz között dönt, használjon numerikus szövegdobozt, ha:

• A képernyőterület szűk.
• A felhasználó valószínűleg szívesebben használja a billentyűzetet.

Használjon csúszkát, ha:

• A felhasználók azonnal visszajelzést kapnak.

Recommendations

• Méretezheti a vezérlőt, hogy a felhasználók egyszerűen meg tudják adni a kívánt értéket. A különálló értékeket tartalmazó beállítások esetében győződjön meg arról, hogy a felhasználó könnyedén kiválaszthat bármilyen értéket az egérrel. Győződjön meg arról, hogy a csúszka végpontjai mindig elférnek a nézet határai között.
• Azonnali visszajelzés küldése a felhasználó kiválasztása közben vagy után (ha gyakorlatias). A Windows hangerőszabályzója például hangjelzéssel jelzi a kiválasztott hangerőt.
• Az értékek tartományát címkék használatával jelenítheti meg. Kivétel: Ha a csúszka függőlegesen orientált, és a felső címke Maximum, Magas, Több vagy azzal egyenértékű, kihagyhatja a többi címkét, mert a jelentés egyértelmű.
• A csúszka letiltásakor tiltsa le az összes társított címkét vagy visszajelzési vizualizációt.
• A csúszka folyamatirányának és/vagy tájolásának beállításakor vegye figyelembe a szöveg irányát. A szkriptek egyes nyelvekben balról jobbra haladnak, másokban pedig jobbról balra.
• Ne használjon csúszkát állapotjelzőként.
• Ne módosítsa a csúszka hüvelykujjának méretét az alapértelmezett méretről.
• Ne hozzon létre folyamatos csúszkát, ha az értékek tartománya nagy, és a felhasználók valószínűleg a tartomány több reprezentatív értékének egyikét választják ki. Ehelyett csak ezeket az értékeket használja az engedélyezett lépések közül. Ha például az időérték akár 1 hónap is lehet, de a felhasználóknak csak 1 perc, 1 óra, 1 nap vagy 1 hónap közül kell választaniuk, akkor hozzon létre egy csúszkát, amely csak 4 lépésponttal rendelkezik.

További használati útmutató

A megfelelő elrendezés kiválasztása: vízszintes vagy függőleges

A csúszkát vízszintesen vagy függőlegesen is beállíthatja. Ezekkel az irányelvekkel meghatározhatja, hogy melyik elrendezést használja.

• Használjon természetes tájolást. Ha például a csúszka egy olyan valós értéket jelöl, amely általában függőlegesen jelenik meg (például hőmérséklet), használjon függőleges tájolást.
• Ha a vezérlőt médiatartalmakon belüli keresésre használják, például egy videóalkalmazásban, használjon vízszintes tájolást.
• Ha olyan csúszkát használ az oldalon, amely egy irányba (vízszintesen vagy függőlegesen) pásztázható, a csúszkához a pásztázó iránytól eltérő tájolást használjon. Ellenkező esetben előfordulhat, hogy a felhasználók pöccintéssel pöccintik a csúszkát, és véletlenül módosítják annak értékét, amikor pásztázzák az oldalt.
• Ha még mindig nem tudja biztosan, hogy melyik tájolást használja, használja a lapelrendezésnek leginkább megfelelőt.

Tartomány iránya

A tartomány iránya az az irány, amelybe a csúszkát az aktuális értékről a maximális értékre húzza.

• Függőleges csúszka esetén az olvasási iránytól függetlenül helyezze a legnagyobb értéket a csúszka tetejére. Egy hangerő csúszkánál például mindig a csúszka tetején helyezze el a maximális hangerőt. Más típusú értékeknél (például a hét napjainál) kövesse az oldal olvasási irányát.
• Vízszintes stílusok esetén helyezze az alsó értéket a csúszka bal oldalára a balról jobbra irányuló elrendezéshez, és a jobb oldalára a jobbról balra irányuló elrendezéshez.
• Az előző útmutató egyetlen kivétele a médiakeresési sávok esetében: mindig helyezze az alsó értéket a csúszka bal oldalára.

Lépések és osztásjelek

• Használjon lépéspontokat, ha nem szeretné, hogy a csúszka tetszőleges értékeket engedélyezjen min és max között. Ha például csúszkával adja meg a megvásárolni kívánt filmjegyek számát, ne engedélyezze a lebegőpontos értékeket. Adjon neki egy lépésköz értéket, amely 1.
• Ha lépéseket (más néven illesztési pontokat) ad meg, győződjön meg arról, hogy az utolsó lépés a csúszka maximális értékéhez igazodik.
• Használjon osztásjeleket, ha meg szeretné jeleníteni a felhasználók számára a főbb vagy jelentős értékek helyét. A nagyítást vezérlő csúszkák például 50%, 100%és 200%osztásjelekkel rendelkezhetnek.
• Osztásjelek megjelenítése, ha a felhasználóknak ismernie kell a beállítás hozzávetőleges értékét.
• Osztásjelek és értékfeliratok megjelenítése, ha a felhasználóknak ismerniük kell a kiválasztott beállítás pontos értékét anélkül, hogy a vezérlőt használták. Ellenkező esetben a buborék segítségével megtekinthetik a pontos értéket.
• Mindig osztásjeleket jelenítsen meg, ha a lépéspontok nem egyértelműek. Ha például a csúszka 200 képpont széles és 200 illesztési ponttal rendelkezik, elrejtheti az osztásjeleket, mert a felhasználók nem fogják észrevenni az illesztési viselkedést. De ha csak 10 illesztési pont van, osztásjeleket jelenítsen meg.

Címkék

• csúszkafeliratok

  A csúszka felirata jelzi, hogy mire használja a csúszkát.

  • Használjon záró írásjel nélküli címkét (ez az összes vezérlőcímke konvenciója).
  • Helyezze a címkéket a csúszka fölé, ha a csúszka olyan formában van, amely a legtöbb címkét a vezérlők fölé helyezi.
  • Helyezze a címkéket az oldalakra, amikor a csúszka olyan elrendezésű, hogy a címkék többsége a vezérlők oldalára kerül.
  • Ne helyezzen címkéket a csúszka alá, mert a felhasználó ujja elzárhatja a címkét, amikor a felhasználó megérinti a csúszkát.

• Tartománycímkék

  A tartomány vagy kitöltés címkéi a csúszka minimális és maximális értékeit írják le.

  • Címkézze fel a csúszkatartomány két végét, hacsak a függőleges tájolás nem teszi szükségtelensé.
  • Ha lehetséges, csak egy szót használjon minden címkéhez.
  • Ne használjon záró írásjelet.
  • Győződjön meg arról, hogy ezek a címkék leíróak és párhuzamosak. Példák: Maximum/Minimum, More/Less, Low/High, Soft/Loud.

• Értékfeliratok

  Az értékfelirat a csúszka aktuális értékét jeleníti meg.

  • Ha értékfeliratra van szüksége, a csúszka alatt jelenítse meg.
  • A szöveg középre igazítása a vezérlőhöz viszonyítva, és az egységek (például képpontok) belefoglalása.
  • Mivel a csúszka hüvelykujja le van fedve a tisztítás során, fontolja meg az aktuális érték más módon történő megjelenítését egy címkével vagy más vizualizációval. A csúszkabeállítás szövegmérete a csúszka mellett megjeleníthet néhány, a megfelelő méretű mintaszöveget.

Megjelenés és interakció

A csúszka egy pályából és egy fogantyúból áll. A sáv egy csík (amely opcionálisan különböző jeleket jeleníthet meg), amely a bevihető értékek tartományát jelöli. A hüvelykujj egy választó, amelyet a felhasználó a pályára koppintva vagy oda-vissza súrolással helyezhet el.

A csúszkának nagy érintési felülete van. Az érintéses akadálymentesség fenntartása érdekében a csúszkát elég messze kell elhelyezni a kijelző szélétől.

Egyéni csúszka tervezésekor fontolja meg, hogyan jelenítheti meg az összes szükséges információt a felhasználónak a lehető legkevesebb zsúfoltság mellett. Használjon értékcímkét, ha a felhasználónak ismernie kell az egységeket a beállítás megértéséhez; kreatív módon ábrázolhatja ezeket az értékeket grafikusan. A hangerőt vezérlő csúszkák például hanghullámok nélkül jeleníthetik meg a hangszóró ábráját a csúszka minimális végén, és egy hanghullámokat tartalmazó hangszóró-ábrát a maximális végén.

Példák

0 és 100 közötti csúszka, 10 pontos léptékekkel ellátva.

Csúszka létrehozása

• Fontos API-k: Csúszkaosztály, Érték tulajdonság, Értékváltozás esemény

Nyissa meg a WinUI 3 Katalógus alkalmazást, és tekintse meg a csúszkát működés közben

A WinUI 3 Katalógus alkalmazás interaktív példákat tartalmaz a WinUI vezérlőire és funkcióira. Kérje le az alkalmazást a Microsoft Áruházból vagy keresse meg a forráskódot a GitHub webhelyen.

Így hozhat létre csúszkát az XAML-ben.

<Slider x:Name="volumeSlider" Header="Volume" Width="200"
        ValueChanged="Slider_ValueChanged"/>

Így hozhat létre csúszkát a kódban.

Slider volumeSlider = new Slider();
volumeSlider.Header = "Volume";
volumeSlider.Width = 200;
volumeSlider.ValueChanged += Slider_ValueChanged;

// Add the slider to a parent container in the visual tree.
stackPanel1.Children.Add(volumeSlider);

A csúszka értékét az Érték tulajdonságból szerezheti be és állíthatja be. Az értékváltozásokra való reagáláshoz adatkötést használhat az Érték tulajdonsághoz való kötéshez, vagy kezelheti a ValueChanged eseményt.

private void Slider_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
{
    Slider slider = sender as Slider;
    if (slider != null)
    {
        media.Volume = slider.Value;
    }
}

Kapcsolódó témakörök

• Kapcsolókapcsolók
• csúszkaosztály