develop

Components and APIs

Components have the same names and props as React Native. Children are positional arguments. Props are keyword arguments.

Writing components

A component is a function that returns elements. Pass children first, then props. Both camelCase and snake_case prop names work.

python

from pyxpo import Image, Pressable, StyleSheet, Text, View

def Card(title, image, on_open):
    return Pressable(
        View(
            Image(source={"uri": image}, style=styles.image),
            Text(title, style=styles.title),
        ),
        onPress=on_open,
        style=styles.card,
    )

styles = StyleSheet.create(
    card=dict(borderRadius=16, backgroundColor="#fff", overflow="hidden"),
    image=dict(height=160),
    title=dict(padding=12, fontSize=17, fontWeight="600"),
)

onPress and on_press are the same prop. Passing both raises an error, like a duplicate keyword argument.

Lists

FlatList renders long lists and only builds the rows on screen.

python

from pyxpo import FlatList, Text

def Names(people):
    return FlatList(
        data=people,
        keyExtractor=lambda p, i: p["id"],
        renderItem=lambda row: Text(row["item"]["name"]),
    )

Styles

Styles are dicts with React Native keys: flexbox layout, colors, borders, shadows and transforms. Use StyleSheet.create to name them, and pass a list to combine several. Light and dark themes, dynamic styles and breakpoint values are on Styling and themes.

python

Text("Hi", style=[styles.title, done and styles.done])

Core components

Layout components

Responsive building blocks on top of View. See Responsive layout.

APIs

python

from pyxpo import Alert, Linking, Platform

def confirm_delete(on_yes):
    Alert.alert("Delete note?", "This cannot be undone.", [
        {"text": "Cancel", "style": "cancel"},
        {"text": "Delete", "style": "destructive", "onPress": on_yes},
    ])

if Platform.OS == "ios":
    Linking.openURL("https://example.com")

More modules in pyxpo

Module	Use it for
`pyxpo.animated`	Animated values, timing and spring animations.
`pyxpo.gesture_handler`	Pan, tap and other gestures.
`pyxpo.safe_area`	Safe area insets and SafeAreaProvider.
`pyxpo.vector_icons`	Icon fonts for buttons and tabs.
`pyxpo.fonts`	Load custom fonts from assets.