react native - NavigationBar not show up inside ScrollView.Provider shoutem/animation -
i try use shoutem in project, when try using @shoutem/animation make screen better when somthing scroll list, have problem. please code below here:
here import :
import react, { component } 'react'; import { screen, text, image, tile, title, subtitle, navigationbar, view, scrollview } '@shoutem/ui'; import { scrolldriver, } '@shoutem/animation'; return ( <scrollview.driverprovider> <screen> <navigationbar stylename='clear' animationname="solidify" title={restaurant.name} share={{ title: restaurant.name, link: restaurant.url, }} /> <scrollview> <image stylename="large-portrait placeholder" source={{ uri: restaurant.image.url }} animationname="hero" > <tile animationname="hero"> <title>{restaurant.name}</title> <subtitle>{restaurant.address}</subtitle> </tile> </image> <view stylename="solid" style={{ backgroundcolor: 'white', height: 700, padding: 15, }} > <text> gaspar delightful french restaurant in san francisco\’s financial district inspired romantic, bustling paris of old. located near famed union square, our richly-designed interiors make feel if in paris , provide perfect setting enjoying our exquisite classic , modern french fare such duck leg confit , popular steak frites. gaspar offers 2 stories of dining in addition full bars both upstairs , downstairs , exclusive room reserved hold largest selection of cognac in san francisco. in addition our day menu, offer live jazz music on saturdays. </text> </view> </scrollview> </screen> </scrollview.driverprovider> );and here error, when scroll down, still got nothing showup. 
please suggest me solution resolve it, guys
navigationbar imported shoutem/ui doesn't know work scrollview.driverprovider
so achieve wanted animation, this:
myscreen extends react.component { constructor() { this.scrolldriver = new scrolldriver(); } render() { return ( <screen> <navigationbar stylename='clear' animationname="solidify" title={restaurant.name} share={{ title: restaurant.name, link: restaurant.url, }} driver={this.scrolldriver} /> <scrollview driver={this.scrolldriver}> <image stylename="large-portrait placeholder" source={{ uri: restaurant.image.url }} animationname="hero" > <tile animationname="hero"> <title>{restaurant.name}</title> <subtitle>{restaurant.address}</subtitle> </tile> </image> <view stylename="solid" style={{ backgroundcolor: 'white', height: 700, padding: 15, }} > <text> gaspar delightful french restaurant in san francisco\’s financial district inspired romantic, bustling paris of old. located near famed union square, our richly-designed interiors make feel if in paris , provide perfect setting enjoying our exquisite classic , modern french fare such duck leg confit , popular steak frites. gaspar offers 2 stories of dining in addition full bars both upstairs , downstairs , exclusive room reserved hold largest selection of cognac in san francisco. in addition our day menu, offer live jazz music on saturdays. </text> </view> </scrollview> </screen> ); } }or if screen inside shoutem extension or using cardstack @shoutem/ui/navigation in project remove scrollview.driverprovider , change import of navigationbar @shoutem/ui @shoutem/ui/navigation
Comments
Post a Comment