simontreny

import React from "react";
import { Image, ScrollView, Text, View } from "react-native";

export default class App extends React.Component {
  state = { text: "" };

  render() {
    return (
      <ScrollView style={{ flex: 1, backgroundColor: "white" }}>
        {this.renderHeader()}

simontreny

  // Ajout de scrollOffset à l'état
  state = { text: "", scrollOffset: 0 };

  render() {
    return (
      <ScrollView
        style={{ flex: 1, backgroundColor: "white" }}
        // Mis à jour de scrollOffset sur l'évènement onScroll
        onScroll={e => this.setState({ scrollOffset: e.nativeEvent.contentOffset.y })}
        // scrollEventThrottle={1} est nécessaire afin d'être notifié

simontreny

  // scrollOffset est maintenant une Animated.Value
  state = { text: "", scrollOffset: new Animated.Value(0) };

  render() {
    // Utilisation d'Animated.event pour mettre à jour scrollOffset lors de l'évènement onScroll
    const scrollEvent = Animated.event(
      [{ nativeEvent: { contentOffset: { y: this.state.scrollOffset } } }],
      { useNativeDriver: true }
    );
    return (

simontreny

  renderHeader() {
    const { scrollOffset } = this.state;
    const expandedHeaderHeight = 240;
    const collapsedHeaderHeight = 64;
    const titleHeight = 44;
    const scrollSpan = expandedHeaderHeight - collapsedHeaderHeight;

    return (
      <Animated.View
        style={{

simontreny

describe('Example', () => {
  beforeEach(async () => {
    await device.reloadReactNative();
  });

  it('should have welcome text', async () => {
    await expect(element(by.id('welcomeText'))).toBeVisible();
  });

  it('should show hello screen after tap', async () => {

simontreny

"detox": {
   "configurations": {
      "ios.sim.debug": {
         "binaryPath": "ios/build/Build/Products/Debug-iphonesimulator/MonApp.app",
         "build": "xcodebuild -project ios/MonApp.xcodeproj -scheme example -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build",
         "type": "ios.simulator",
         "name": "iPhone 7"
      }
   }
}

simontreny

const initialState = {
  visibilityFilter: VisibilityFilters.SHOW_ALL,
  todos: []
}

function todos(state = [], action) {
  switch (action.type) {
    case ADD_TODO:
      return [
        ...state,

simontreny

type Listener<T> = (val: T) => void;
type Unsubscriber = () => void;

export class Observable<T> {
    private _listeners: Listener<T>[] = [];

    constructor(private _val: T) {}

    get(): T {
        return this._val;

simontreny

import { useEffect, useState } from "react";
import { Observable } from "./observable";

export function useObservable<T>(observable: Observable<T>): T {
    const [val, setVal] = useState(observable.get());

    useEffect(() => {
        return observable.subscribe(setVal);
    }, [observable]);

simontreny

import { Observable } from "./observable";

export interface Todo {
    readonly text: string;
    readonly completed: boolean;
}

export enum VisibilityFilter {
    SHOW_ALL,
    SHOW_COMPLETED,