letsar / flutter_parallax

A Flutter widget that moves according to a scroll controller.
MIT License
100 stars 13 forks source link

Parallax without list view #2

Open vijayvepa opened 6 years ago

vijayvepa commented 6 years ago

Is it possible to implement parallax without the list view?

I am trying to implement the parallax in https://github.com/iminyourhouse-turnaround as an exercise.

When I use the Parallax.inside or Parallax.outside methods, I get the below error. I don't get error with SingleChildScrollView but only the top layer scrolls.

github404demo

I have attached the assets, pubspec and the main.dart

pubspec.yaml.zip assets.zip main.dart.zip image-assets.dart.zip

Thanks, Vijay

`══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ The following assertion was thrown during performLayout(): ScrollController attached to multiple scroll views. 'package:flutter/src/widgets/scroll_controller.dart': Failed assertion: line 111 pos 12: '_positions.length == 1'

Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause. In either case, please report this assertion by filing a bug on GitHub: https://github.com/flutter/flutter/issues/new

When the exception was thrown, this was the stack:

2 ScrollController.position (package:flutter/src/widgets/scroll_controller.dart:111:12)

3 ParallaxWithAxisDirectionDelegate._getParallaxDirection (package:flutter_parallax/src/rendering/parallax.dart:164:64)

4 ParallaxOutsideDelegate.getConstraintsForChild (package:flutter_parallax/src/rendering/parallax.dart:259:45)

5 RenderParallaxSingleChildLayoutBox.performLayout (package:flutter_parallax/src/rendering/parallax.dart:336:56)

6 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

7 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

8 _RenderCustomClip.performLayout (package:flutter/src/rendering/proxy_box.dart:1138:24)

9 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

10 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:509:15)

11 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

12 MultiChildLayoutDelegate.layoutChild (package:flutter/src/rendering/custom_layout.dart:124:11)

13 _ScaffoldLayout.performLayout (package:flutter/src/material/scaffold.dart:256:7)

14 MultiChildLayoutDelegate._callPerformLayout (package:flutter/src/rendering/custom_layout.dart:194:7)

15 RenderCustomMultiChildLayoutBox.performLayout (package:flutter/src/rendering/custom_layout.dart:338:14)

16 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

17 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

18 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

19 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

20 _RenderCustomClip.performLayout (package:flutter/src/rendering/proxy_box.dart:1138:24)

21 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

22 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

23 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

24 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:509:15)

25 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

26 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

27 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

28 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

29 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

30 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

31 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

32 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

33 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

34 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

35 RenderOffstage.performLayout (package:flutter/src/rendering/proxy_box.dart:2710:26)

36 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

37 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

38 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

39 RenderStack.performLayout (package:flutter/src/rendering/stack.dart:509:15)

40 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

41 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

42 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

43 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

44 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

45 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

46 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

47 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

48 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

49 RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:107:13)

50 RenderObject.layout (package:flutter/src/rendering/object.dart:1570:7)

51 RenderView.performLayout (package:flutter/src/rendering/view.dart:142:13)

52 RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1445:7)

53 PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:709:18)

54 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:270:19)

55 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:622:22)

56 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:208:5)

57 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:990:15)

58 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:930:9)

59 BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.scheduleWarmUpFrame. (package:flutter/src/scheduler/binding.dart:751:7)

61 _Timer._runTimers (dart:isolate-patch/dart:isolate/timer_impl.dart:382)

62 _Timer._handleMessage (dart:isolate-patch/dart:isolate/timer_impl.dart:416)

63 _RawReceivePortImpl._handleMessage (dart:isolate-patch/dart:isolate/isolate_patch.dart:165)

(elided 3 frames from class _AssertionError and package dart:async-patch)

The following RenderObject was being processed when the exception was fired: RenderParallaxSingleChildLayoutBox#3daa6 relayoutBoundary=up3 NEEDS-LAYOUT NEEDS-PAINT creator: ParallaxSingleChildLayout ← ClipRect ← Parallax ← Stack ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← DefaultTextStyle ← AnimatedDefaultTextStyle ← _InkFeatures-[GlobalKey#37fde ink renderer] ← NotificationListener ← PhysicalModel ← ⋯ parentData: (can use size) constraints: BoxConstraints(0.0<=w<=375.0, 0.0<=h<=712.0) size: Size(375.0, 712.0) This RenderObject had the following descendants (showing up to depth 5): RenderConstrainedBox#b5745 NEEDS-LAYOUT NEEDS-PAINT RenderPositionedBox#d7836 NEEDS-LAYOUT NEEDS-PAINT RenderPadding#aa770 NEEDS-LAYOUT NEEDS-PAINT RenderConstrainedBox#f7504 NEEDS-LAYOUT NEEDS-PAINT RenderDecoratedBox#0dd90 NEEDS-LAYOUT NEEDS-PAINT ════════════════════════════════════════════════════════════════════════════════════════════════════ Reloaded 1 of 486 libraries in 1,863ms. `

letsar commented 6 years ago

Hi, when a ScrollController is attached to multiple scrollable elements, the position property returns the above exception. For now what you want to achieve is not possible with this library but I'm currently working on it 😄!

I don't now know how to have multiple slivers that can overlap each other in a single CustomScrollView. This is what delaying me now. If you know how to do it, feel free to help me 😃.

vijayvepa commented 6 years ago

(Probably silly question) What if we use two separate scroll controllers?

On Mon, Apr 2, 2018 at 12:30 PM, Romain Rastel notifications@github.com wrote:

Hi, when a ScrollController is attached to multiple scrollable elements, the position property returns the above exception. For now what you want to achieve is not possible with this library but I'm currently working on it 😄!

I don't now know how to have multiple slivers that can overlap each other in a single CustomScrollView. This is what delaying me now. If you know how to do it, feel free to help me 😃.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/letsar/flutter_parallax/issues/2#issuecomment-377970716, or mute the thread https://github.com/notifications/unsubscribe-auth/AEvjrGaKVaTacNWXTjGBi2B3plXT6USpks5tklIZgaJpZM4TDA5B .

letsar commented 6 years ago

Did'nt test it but I think only one ScrollController will work. In your case, maybe you can use a multiple Parallax.outside in a Stackbehind only one SingleChildScrollView?

vijayvepa commented 6 years ago

I am a novice in flutter, It would be great if you can provide sample code to try that.

Thank you, Vijay

On Wed, Apr 4, 2018 at 5:10 PM, Romain Rastel notifications@github.com wrote:

Did'nt test it but I think only one ScrollController will work. In your case, maybe you can use a multiple Parallax.outside in a Stackbehind only one SingleChildScrollView?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/letsar/flutter_parallax/issues/2#issuecomment-378746344, or mute the thread https://github.com/notifications/unsubscribe-auth/AEvjrOvxaP9RbKOoYH9NHVs1Fh10JMiTks5tlTbLgaJpZM4TDA5B .