Téléchargement gluestack style - Téléchargement du code source gluestack style

gluestack style

Code Source AI

@gluestack-style

Télécharger

⛔️ déprécié

Nous avons obsolète ce référentiel et migré notre base de code vers une nouvelle structure de référentiel mono, veuillez suivre ce lien pour accéder à nos dernières mises à jour et fonctionnalités.

Une bibliothèque qui vous permet d'utiliser CSS dans vos projets natifs React and React de manière moderne, puissante et flexible. gluestack-style vous permet d'écrire CSS en utilisant JavaScript, ce qui vous permet de profiter de la puissance et de l'expressivité des deux langues. Avec son API simple et intuitive, vous pouvez facilement créer des styles dynamiques, une conception réactive et gérer des thèmes pour vos applications.

Documentation

Vous pouvez trouver une documentation détaillée pour chaque composant, y compris une liste d'accessoires et d'exemples, sur https://gluestack.io/style/docs/getting-started/installation.

Caractéristiques

Styles dynamiques: en utilisant des expressions JavaScript, vous pouvez créer des styles dynamiques qui changent en fonction de l'état de vos composants.
Prise en charge du rendu côté serveur (SSR): Cela vous permet d'utiliser les mêmes styles sur le serveur et le client, ce qui facilite la mise en œuvre de SSR pour vos applications React.
Styling réactif :: Cela vous permet de créer facilement des styles réactifs qui s'adaptent à différentes tailles d'écran et résolutions.
Prise en charge du thème: vous pouvez facilement définir et basculer entre différents thèmes pour votre application, permettant une conception cohérente sur toutes les pages.
Mises à jour fréquentes: nous travaillons constamment sur l'amélioration de la bibliothèque et l'ajout de nouveaux composants. Suivez-nous sur GitHub pour rester à jour sur les dernières versions et fonctionnalités.
Support communautaire: Besoin d'aide en utilisant la bibliothèque ou avez une suggestion pour une nouvelle fonctionnalité? Rejoignez notre canal Discord pour vous connecter avec la communauté et obtenir du soutien.

Installation `gluestack-style`

Pour utiliser gluestack-style , tout ce que vous avez à faire est d'installer le package @gluestack-style/react et ses dépendances par les pairs:

$ yarn add @gluestack-style/react

# or

$ npm i @gluestack-style/react

Pile technologique

JavaScript, React, React Native, Styled System

Usage

Pour utiliser le gluestack-style dans votre projet, suivez ces étapes:

Enveloppez votre application avec le StyledProvider fourni par @ Gluestack-style / React .

 import { StyledProvider } from '@gluestack-style/react' ;

// Do this at the root of your application
function App ( { children } ) {
  return < StyledProvider > { children } </ StyledProvider > ;
}

Vous pouvez maintenant utiliser @gluestack-style/react pour style vos composants en utilisant la fonction styled fournie par la bibliothèque. Par exemple:

 import React from 'react' ;
import { styled , StyledProvider } from '@gluestack-style/react' ;

const StyledButton = styled (
  Pressable ,
  {
    bg : '$red500' ,
    p : '$3' ,
  } ,
  { }
) ;

const StyledButtonText = styled ( Text , { } , { } ) ;

export const App = ( ) => {
  return (
    < StyledProvider >
      < StyledButton >
        < StyledButtonText > Button </ StyledButtonText >
      </ StyledButton >
    </ StyledProvider >
  ) ;
} ;

Plus de guides sur la façon de commencer sont disponibles ici.

Contributif

Nous saluons les contributions au gluestack-style ! Si vous avez une idée pour un nouveau composant ou un correctif de bogue, veuillez lire nos instructions de guide de contribution sur la façon de soumettre une demande de traction.