Effects
LEGEND APPSPreview
Code walkthrough
Emphasize and scroll to selected lines of source.
← All effects
Still captured in Legend Slides for macOS (development build).
Requires a Legend Slides build with effect installation support. Installs the presenting pack (1.0.0, 22 KB source) and its dependencies. macOS host capabilities: reanimated, skia. Installed decks work offline.
Use it in a deck
---
title: Code walkthrough
---
import { View, Text } from "react-native";
import { CodeWalkthrough } from "slides:presenting/CodeWalkthrough";
export const code = "const data = await load();\nconst result = transform(data);\nrender(result);";
# Code walkthrough
<View style={{ width: 1696, height: 650 }}>
<Steps count={3}>{step => <CodeWalkthrough source={code} lines={[step + 1, step + 1]} explanation={<Text style={{color: "white",fontSize: 48}}>Follow the highlighted line.</Text>} />}</Steps>
</View>
Configure
- source
- Source text to display.
- lines
- One-based selected lines.
- explanation
- Content beside the code.
Only imported effects enter the compiled deck. Installation and versioning →