Skip to content
Browse files

Add NetworkDemo example code and GIF to README

  • Loading branch information...
MaxDesiatov committed Mar 25, 2019
1 parent 8bf37d3 commit 90315e0ecd021259bbed5bed5ad09b7dd6761b0c
Showing with 72 additions and 0 deletions.
  1. +72 −0
  2. BIN TokamakNetworking.gif
@@ -124,6 +124,8 @@ questions!

## Example code

### Counter

An example of a Tokamak component that binds a button to a label looks like

@@ -190,6 +192,76 @@ controller, and windows don't have a fixed predefined size by default.

![Counter component](

### Networking

Tokamak allows you to easily express asynchronous state changes as well. Here's
an example of loading content from `` URL:

![Networking demo](

Code that implements this component looks like this:

import Alamofire
import Tokamak
public struct NetworkDemo: LeafComponent {
public typealias Props = Null
enum State {
case initial
case loading
case finished(Result<String>)
public static func render(props: Null, hooks: Hooks) -> AnyNode {
let state = hooks.state(State.initial)
let style = Style(Edges.equal(to: .safeArea, inset: 10))
switch state.value {
case .initial:
return Button.node(.init(
onPress: Handler {
Alamofire.request("").responseString {
text: "Load"
case .loading:
return View.node(
[Size.equal(to: 100), Center.equal(to: .parent)],
backgroundColor: .black,
cornerRadius: 10
isAnimating: true,
variety: .whiteLarge
case let .finished(.success(value)):
return Label.node(.init(
alignment: .center,
text: value
case let .finished(.failure(error)):
return Label.node(.init(
alignment: .center,
text: error.localizedDescription

## Example project

The best way to try Tokamak in action is to run the example project:
BIN +198 KB TokamakNetworking.gif
Binary file not shown.

0 comments on commit 90315e0

Please sign in to comment.
You can’t perform that action at this time.