#Deprecated linear-weight-sum

#Introduction

Child element's weight sum in linear.

When linear-weight-sum property of the linear view is non-zero.

• The linear-layout first lays out all the child elements whose linear-weight:0, and calculates the width of these child elements in the layout direction.

• The remaining linear-weight non-zero child elements will be allocated the remaining width(linear layout view width minus the width of all linear-weight:0 child elements) in the main axis according to their linear-weight. For ease of presentation, we view "the sum of the children linear-weight " as symbol "S".

  • When linear-weight-sum <= S:

    main size of child = corresponding linear-weight ÷ S ✖️ remaining main size width

  • When linear-weight-sum > S:

    main size of child = corresponding linear-weight ÷ linear-weight-sum ✖️ remaining main size width

#Examples

In the figure, the width of the parent element is 400px, the first element is fixed at 100px, and the remaining width is 300px. The second and third elements specify the size, and are allocated according to the weight. The second element is 200px wide and the third element is 100px wide.

css-apisrc/linear-weight-sum/App.tsx

Preview

#Syntax

linear-weight-sum: 2;
linear-weight-sum: 5.5;

#Values

• <number>

  Negative values are invalid. Default value is 0.

#Formal definition

#Formal syntax

linear-weight-sum = <number>

#Difference between web

• No such style in Web.

#Compatibility

LCD tables only load in the browser

#FAQ

• linear container's main axis size need set a fixed value;

• It is not supported to use a fixed value and weight at the same time. If there is a linear-weight, the fixed value is automatically ignored (performance first);