Jetpack Compose Glimmer jest oparty na Jetpack Compose i zawiera funkcje kompozycyjne, komponenty, zachowania i motyw zaprojektowane z myślą o okularach z wyświetlaczem. Glimmer umożliwia tworzenie natywnych interfejsów AI do okularów z AI za pomocą Compose. Dzięki temu możesz ożywić swoje aplikacje przy użyciu mniejszej ilości kodu, zaawansowanych narzędzi i intuicyjnych interfejsów Kotlin API.
Funkcje kompozycyjne Glimmer w Jetpack Compose
Jetpack Compose Glimmer udostępnia funkcje @Composable dostosowane do wyświetlaczy okularów AI, takie jak Text, Button i ListItem. Oto niektóre unikalne cechy komponentów Glimmer w Jetpack Compose:
- Uproszczone style: komponenty
Surfacemają domyślnie czarne lub przezroczyste tło, co pozwala zoptymalizować wyświetlanie. - Zoptymalizowane domyślne kolory: Jetpack Compose Glimmer domyślnie oblicza kolor treści na podstawie koloru tła, więc programiści rzadko muszą ręcznie ustawiać kolory tekstu, co zwiększa czytelność bez dodatkowej pracy.
Zróżnicowane zaznaczenie: zaznaczenie jest wskazywane za pomocą wizualnego obrysu zamiast efektu fali, co zapewnia lepszą widoczność.
Rysunek 1. 3 stany zaznaczenia w Glimmer w Jetpack Compose, które są rozróżniane za pomocą wizualnych informacji zwrotnych opartych na konturach. Zoptymalizowane podniesienie: Jetpack Compose Glimmer używa ograniczonych cieni, aby wizualnie oddzielić elementy.
Rysunek 2. 5 poziomów uniesienia w Jetpack Compose Glimmer, które są rozróżniane za pomocą ograniczonych cieni.
Komponenty Glimmer w Jetpack Compose
Jetpack Compose Glimmer zawiera własny zestaw zaprojektowanych specjalnie komponentów, podobnych do komponentów w Jetpack Compose, ale zoptymalizowanych pod kątem wyjątkowych wymagań wizualnych i interaktywnych okularów z AI. Komponenty Glimmer w Jetpack Compose można dostosowywać za pomocą motywu Glimmer w Jetpack Compose. Są one oparte na funkcjach Compose niższego poziomu, aby domyślnie obsługiwać metody wprowadzania danych użytkownika, takie jak klikanie i przesuwanie.
Więcej informacji o korzystaniu z poszczególnych komponentów znajdziesz w tych przewodnikach:
Jeśli jeden z tych komponentów wysokiego poziomu nie pasuje do Twojego przypadku użycia, możesz użyć surface, aby utworzyć komponent niestandardowy. Powierzchnie to podstawowy element składowy w Jetpack Compose Glimmer – puste płótno, na którym możesz tworzyć dowolne, niestandardowe projekty lub interakcje.
Modyfikatory Glimmer w Jetpack Compose
Modyfikatory w funkcji Glimmer w Jetpack Compose działają identycznie jak modyfikatory Compose, dzięki czemu możesz rozszerzać funkcjonalność komponentów kompozycyjnych, dostosowując ich układ, wygląd i zachowanie. Glimmer w Jetpack Compose może wprowadzać konkretne modyfikatory lub stosować unikalne wartości domyślne w przypadku wizualnych informacji zwrotnych i wydajności specyficznych dla okularów.
Głębokość efektu Glimmer w Jetpack Compose
Komponenty Jetpack Compose Glimmer używają głębi do reprezentowania hierarchii, co pomaga wizualnie odróżnić elementy wyświetlane nad innymi kartami. Głębia w okularach z AI to połączenie umieszczenia w przestrzeni Z i cieni. W przypadku większości komponentów wyższego poziomu, takich jak elementy listy, głębia jest stosowana automatycznie na podstawie stanu fokusu. Gdy komponent jest zaznaczony, zyskuje głębię, a gdy traci zaznaczenie, wraca do normalnego stanu. W przypadku komponentów niestandardowych możesz jednak użyć parametru depth w tagu Modifier.surface lub Modifier.depth.
Motyw Glimmer w Jetpack Compose
Jetpack Compose Glimmer ma specjalny system motywów dla okularów z AI.
Motyw Glimmer w Jetpack Compose zawiera uproszczoną i zoptymalizowaną paletę kolorów, typografii i kształtów. Zapewnia to maksymalną widoczność i zwięzłość informacji wyświetlanych na okularach z AI. Wszystkie komponenty Glimmer w Jetpack Compose są zaprojektowane z myślą o automatycznej integracji z określonymi metodami wprowadzania danych w okularach z AI. Motyw Glimmer w Jetpack Compose jest udostępniany za pomocą klasy GlimmerTheme.
Podobnie jak inne motywy w Jetpack Compose, GlimmerTheme zawiera kilka podsystemów: kolory, kształty, typografię i ikony (symbolografię). Motyw Glimmer w Jetpack Compose zawiera też komponenty Glimmer w Jetpack Compose, które możesz dostosować.
Kolory
System kolorów Glimmer w Jetpack Compose obejmuje 7 kolorów w zoptymalizowanej palecie, które zapewniają maksymalną widoczność i zwięzłość na wyświetlaczach okularów z AI, gdzie wartości czerni nie są renderowane.
GlimmerTheme.Pamiętaj, że kolory „On ...” nie są dostępne w GlimmerTheme. Te kolory są automatycznie obliczane przez system na podstawie koloru tła.
Te kolory są udostępniane za pomocą GlimmerTheme.colors.primary, a wartości dla każdej roli koloru są opisane w tej tabeli:
Rola koloru |
Domyślne |
|---|---|
główny |
#9BBFFF |
dodatkowy, |
#4C88E9 |
pozytywny |
#63FEA8 |
minus |
#FFA7A0 |
platforma |
#262626 |
konspekt |
#606460 |
outlineVariant |
#42434A |
Pamiętaj, że chociaż wartości surface, outline i outlineVariant są oznaczone jako konfigurowalne, zdecydowanie zalecamy, aby ich nie dostosowywać.
Kształty
System kształtów Glimmer w Jetpack Compose definiuje zestaw standardowych kształtów narożników i form geometrycznych komponentów, które mają tworzyć spójny i minimalistyczny język wizualny w interfejsach okularów z AI. Wszystkie kształty są dostępne w GlimmerTheme.shapes.
Typografia
System typografii Jetpack Compose Glimmer obejmuje sześć stylów typografii, które zapewniają czytelność i zwięzłość na wyświetlaczach okularów z AI. Te style zostały zaprojektowane tak, aby zmaksymalizować kontrast i poprawić czytelność tekstu dzięki pogrubionym znakom, większym odstępom między literami i odpowiednim wysokościom wierszy. Te style są udostępniane za pomocą elementu GlimmerTheme.typography.
Ikony
System ikon Glimmer w Jetpack Compose został zaprojektowany tak, aby spójnie integrować się z uproszczonym językiem wizualnym interfejsów okularów z AI. Często wykorzystuje zaokrąglone kształty, takie jak Material Symbols Rounded, aby zapewnić optymalną czytelność.