I have studied for nearly half a month. As a semi-junior student, I feel I have no time to spend. I just studied from the beginning of May to the end of May. = = | |. It is mainly to see that others have achieved such an effect, and they also want to try it, and then they found the gap, but it is better to take a step than to remain at the same time. The cover is a quick slide while loading the number of frames of the picture, and the device is the Honor 9X Beggar edition.

Advance reserve of knowledge

Here give two more representative articles, there is a basic knowledge of the explanation, the two articles involved in the other links must point open slowly read.

Nayuta ListView optimization

The WaterFlow of pharaoh

The sliding principle of GSY

Get into the business

This article is in two parts, starting with the Widget implementation. The next part starts with RenderObject.

Related to the class

If you build your own blocks, there should be three classes.

  1. A Widget class that creates RenderObject
  2. An Element class that manages widgets and renderObjects
  3. A RenderObject class that implements layout and drawing

Know the concept of the ViewPort, I use the official CustomScrollView as ViewPort, official SliverMultiBoxAdaptorElement as widgets and RendetObject management tools, namely Element. So the core implementation of the code is the implementation of RenderObject and Widget.

Flowsilver follows suit

All the other names had been given, so I just made up my mind. SliverList source discovered through research, realize the Widget from the best inheritance SliverMultiBoxAdaptorWidget, implementation is simple, rewrite the following several methods, to provide a constructor.

FlowSliver.builder(
      {Key? key,
      required SliverChildDelegate delegate,// Generate content widgets, such as pictures and cards
      required this.gridDelegate})          // Configure a row with several elements
      : super(key: key, delegate: delegate);



@override
RenderFlowSliver createRenderObject(BuildContext context);

@override
void updateRenderObject(BuildContext context, RenderFlowSliver renderObject);
Copy the code

In this way, a Widget for waterfall flow is encapsulated.

It’s also easy to use

CustomScrollView(Slivers: [FlowSliver(parameter...)] );Copy the code

This has led to some new classes, such as RenderFlowSliver, which is the next article, and which is the core of implementing layouts. The source address will be given in the next article, please note any errors.