Tutorial kategória bejegyzései

Sötét téma CSS-ben

Ma már a legtöbb eszközünk (Windows 10, Android, iOS) képes arra, hogy az éjszaka érkeztével úgynevezett dark mode-ra (sötét téma) váltson, ezt egy sor alkalmazás, köztük a böngészők is támogatják, ha a rendszerünkből is a legfrissebbet használjuk.

Talán már van két éve is, hogy a webprogramozóknak kecsegtető CSS megoldás is elérhető, persze nem mindenáron.

A reszponzív, a megjelenítőhöz igazodó, mobilokon is tökéletesen használható weboldalaknál már ismerős a media query, ezzel lehet ugyanis a képernyőhöz, vagy épp a nyomtatott papírhoz igazítani a megjelenést. Ennek segítségével lehet a sötét módot is használatba venni:

@media (prefers-color-scheme: dark)
{ // rules in here will only be applied if the user's OS is in dark mode! }

Ahogy a fenti példakód is mutatja, az így létrehozott blokkba kerülnek a sötét tartalmi elemekre vonatkozó módosítások. Tehát itt azokat a szelektorokat használhatjuk, amikre a világostól eltérő témát használni akarjuk érvényre juttatni.

Természetesen fordítva is működik, ha a sötét az alapértelmezett témánk, de világosra is válthat a webes app.

// Default body in dark
body
{
background-color: black;
color: white;
}

// Changes if the theme switched to light
@media screen and (prefers-color-scheme: light)
{
body
{
background-color: white;
color: black;
}
}

A dolog nem újkeletű, de ahogy látom, térnyerésére még mindig várni kell.

A böngészőtámogatottsághoz hozzátartozik, hogy az elterjedt Firefox, Edge, Opera, Safari, Chrome nagyágyúk legfrissebb változatai már egészen biztosan támogatják az új media query-t, de érdemes minél több böngészővel tesztelni. A régebbi verziók egészen biztosan nem tudnak mint kezdeni az új funkcióval, de a jó hír, hogy ez esetben semmi sem történik. Nem lesz használhatatlan az oldal, "csupán" semmi nem változik a sötét téma esetén.

[C#] Egyszerű és gyors inputbox adatbekéréshez

Ha a felhasználótól szeretnénk adatot bekérni, viszonylag ritka eset az, hogy egyetlen stringet (vagy stringből átalakítható egyéb adattípust) kérjünk be, de akár elő is fordulhat. Egészen biztosan van ezer plusz egyféle NuGet package ennek megoldására, illetve összetett adat esetén egyébként is javasolt a saját adatbekérő form használata. De ha egyrészt egy gyors, gyári megoldást szeretnénk, másrészt nem kell semmi sallang, erre van egy kevésbé ismert beépített megoldás.

Aki Visual Basic-ben programozik, annak ismerős lesz, de azt talán kevesen tudják, hogy ez elérhető C#-ban is.

C# inputbox

Hogyan működik?

Először is adjuk hozzá a megfelelő VB refrence-t a projektünkhöz:

[Projektnév] > Add > Reference > Assemblies > Microsoft.VisualBasic

C# inputbox

Majd tegyük be a class fejlécébe:

using Microsoft.VisualBasic;

Végül használjuk:

string input = Interaction.InputBox("Prompt", "Title", "Default", x_coordinate, y_coordinate);

C# inputbox

A visszatérési érték egy string a beírt adattal. Üresen hagyott mező vagy "Mégse" gomb lenyomása esetén üres string az eredmény. Csak az első paraméter kötelező, a többi opcionális., ez lesz az inputbox szöveges (magyarázó) része. A többi opcionális, a második lesz az inputbox címsora, a harmadik a default szöveg a beviteli mezőben, míg az utolsó kettő az űrlap pozícióját határozza meg.

Azt nem mondom, hogy minden bajunkat ez meg fogja oldani, de egyrészt rém egyszerű és mindig kéznél van, másrészt ha épp csak ennyire van szükségünk, akkor fölösleges túlbonyolítani.

Egyedüli hátránya, hogy sajnos a kapott inputbox nem átmérezhető, sem programozottan, sem futtatáskor.

//Statelit is marked deprecated and will be removed in the next version