Repository navigation
flexBasis+flexShrink+borderWidth result in an wrong value #1665
Copy link
Copy link
Closed
Description
Report
- I have searched existing issues and this is not a duplicate
flexBasis+flexShrink+borderWidth result in an wrong value
<View style={{ marginTop: 100 }}>
<View style={{ height: 100, marginTop: 20, flexDirection: 'row' }}>
<View style={{
flexBasis: 0,
flexGrow: 1,
flexShrink: 1,
borderWidth: 0.594443, //0.594441 or 0.594442 is correct, but 0.594443 & 0.594444 is in correct
minWidth: 160,
borderColor: '0xff000000',
backgroundColor: 'red',
}}
onLayout={(e) => {
console.log(e.nativeEvent.layout);
}}></View>
<View style={{
flexBasis: 0,
flexGrow: 1,
flexShrink: 1,
borderWidth: 0.594442,
minWidth: 160,
borderColor: '0xff000000',
backgroundColor: 'green',
}} />
<View style={{
flexBasis: 0,
flexGrow: 1,
flexShrink: 1,
borderWidth: 0.594442,
minWidth: 160,
borderColor: '0xff000000',
backgroundColor: 'blue',
}} />
<View style={{
flexBasis: 0,
flexGrow: 1,
flexShrink: 1,
borderWidth: 0.594442,
minWidth: 160,
borderColor: '0xff000000',
backgroundColor: 'yellow',
}} />
</View>
</View >
Expected Behavior
<div layout="width: 393; height: 852; top: 0; left: 0;" style="" >
<div layout="width: 393; height: 852; top: 0; left: 0;" style="flex: 1; " >
<div layout="width: 393; height: 852; top: 0; left: 0;" style="flex: 1; " >
<div layout="width: 393; height: 120; top: 100; left: 0;" style="margin-top: 100px; " >
<div layout="width: 393; height: 100; top: 20; left: 0;" style="flex-direction: row; margin-top: 20px; height: 100px; " >
<div layout="width: 160; height: 100; top: 0; left: 0;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
<div layout="width: 160; height: 100; top: 0; left: 160;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
<div layout="width: 160; height: 100; top: 0; left: 320;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
<div layout="width: 160; height: 100; top: 0; left: 480;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
</div>
</div>
</div>
</div>
</div>
Actual Behavior
<div layout="width: 393; height: 852; top: 0; left: 0;" style="" >
<div layout="width: 393; height: 852; top: 0; left: 0;" style="flex: 1; " >
<div layout="width: 393; height: 852; top: 0; left: 0;" style="flex: 1; " >
<div layout="width: 393; height: 120; top: 100; left: 0;" style="margin-top: 100px; " >
<div layout="width: 393; height: 100; top: 20; left: 0;" style="flex-direction: row; margin-top: 20px; height: 100px; " >
<div layout="width: 1.65759e+11; height: 100; top: 0; left: 0;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594443px; min-width: 160px; " ></div>
<div layout="width: 1.65759e+11; height: 100; top: 0; left: 1.65759e+11;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
<div layout="width: 1.65759e+11; height: 100; top: 0; left: 3.31518e+11;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
<div layout="width: 1.65759e+11; height: 100; top: 0; left: 4.97277e+11;" style="flex-grow: 1; flex-shrink: 1; flex-basis: 0px; border: 0.594442px; min-width: 160px; " ></div>
</div>
</div>
</div>
</div>
</div>
width=1.65759e+11 is an incorrect value
Reactions are currently unavailable


Activity
XuweiQT commentedon Jun 21, 2024
when
flexBasis: 0, flexShrink: 0, No problem.guard shrink-factor division against floating-point near-zero (react#…
guard shrink-factor division against floating-point near-zero (react#…
guard shrink-factor division against floating-point near-zero (#57175)
guard shrink-factor division against floating-point near-zero
guard shrink-factor division against floating-point near-zero (react#…
Fix flex shrink explosion when the shrink total is a positive float r…
Fix flex shrink explosion when the shrink total is a positive float r…
Fix flex shrink explosion when the shrink total is a positive float r…
guard shrink-factor division against floating-point near-zero (react#…
Fix flex shrink explosion when the shrink total is a positive float r…
Fix flex shrink explosion when the shrink total is a positive float r…