NativeScript/nativescript-core/ui/layouts/stack-layout/stack-layout.ios.ts

import { StackLayoutBase, View, layout, VerticalAlignment, HorizontalAlignment } from "./stack-layout-common";
import * as trace from "../../../trace";

export * from "./stack-layout-common";

export class StackLayout extends StackLayoutBase {
    private _totalLength = 0;

    public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        let measureWidth = 0;
        let measureHeight = 0;

        const width = layout.getMeasureSpecSize(widthMeasureSpec);
        const widthMode = layout.getMeasureSpecMode(widthMeasureSpec);

        const height = layout.getMeasureSpecSize(heightMeasureSpec);
        const heightMode = layout.getMeasureSpecMode(heightMeasureSpec);

        const isVertical = this.orientation === "vertical";
        const horizontalPaddingsAndMargins = this.effectivePaddingLeft + this.effectivePaddingRight + this.effectiveBorderLeftWidth + this.effectiveBorderRightWidth;
        const verticalPaddingsAndMargins = this.effectivePaddingTop + this.effectivePaddingBottom + this.effectiveBorderTopWidth + this.effectiveBorderBottomWidth;

        let measureSpec: number;

        let mode = isVertical ? heightMode : widthMode;
        let remainingLength: number;

        if (mode === layout.UNSPECIFIED) {
            measureSpec = layout.UNSPECIFIED;
            remainingLength = 0;
        }
        else {
            measureSpec = layout.AT_MOST;
            remainingLength = isVertical ? height - verticalPaddingsAndMargins : width - horizontalPaddingsAndMargins;
        }

        let childMeasureSpec: number;
        if (isVertical) {
            let childWidth = (widthMode === layout.UNSPECIFIED) ? 0 : width - horizontalPaddingsAndMargins;
            childWidth = Math.max(0, childWidth);
            childMeasureSpec = layout.makeMeasureSpec(childWidth, widthMode);
        }
        else {
            let childHeight = (heightMode === layout.UNSPECIFIED) ? 0 : height - verticalPaddingsAndMargins;
            childHeight = Math.max(0, childHeight);
            childMeasureSpec = layout.makeMeasureSpec(childHeight, heightMode);
        }

        let childSize: { measuredWidth: number; measuredHeight: number };

        this.eachLayoutChild((child, last) => {
            if (isVertical) {

                // Measuring ListView, with no height property set, with layout.AT_MOST will
                // result in total height equal to the count ot all items multiplied by DEFAULT_HEIGHT = 44 or the
                // maximum available space for the StackLayout. Any following controls will be visible only if enough space left.
                childSize = View.measureChild(this, child, childMeasureSpec, layout.makeMeasureSpec(remainingLength, measureSpec));

                if (measureSpec === layout.AT_MOST && this.isUnsizedScrollableView(child)) {
                    trace.write("Avoid using ListView or ScrollView with no explicit height set inside StackLayout. Doing so might result in poor user interface performance and poor user experience.", trace.categories.Layout, trace.messageType.warn);
                }

                measureWidth = Math.max(measureWidth, childSize.measuredWidth);
                let viewHeight = childSize.measuredHeight;
                measureHeight += viewHeight;
                remainingLength = Math.max(0, remainingLength - viewHeight);
            }
            else {
                childSize = View.measureChild(this, child, layout.makeMeasureSpec(remainingLength, measureSpec), childMeasureSpec);
                measureHeight = Math.max(measureHeight, childSize.measuredHeight);
                let viewWidth = childSize.measuredWidth;
                measureWidth += viewWidth;
                remainingLength = Math.max(0, remainingLength - viewWidth);
            }
        });

        measureWidth += horizontalPaddingsAndMargins;
        measureHeight += verticalPaddingsAndMargins;

        // Check against our minimum sizes
        measureWidth = Math.max(measureWidth, this.effectiveMinWidth);
        measureHeight = Math.max(measureHeight, this.effectiveMinHeight);

        this._totalLength = isVertical ? measureHeight : measureWidth;

        const widthAndState = View.resolveSizeAndState(measureWidth, width, widthMode, 0);
        const heightAndState = View.resolveSizeAndState(measureHeight, height, heightMode, 0);

        this.setMeasuredDimension(widthAndState, heightAndState);
    }

    public onLayout(left: number, top: number, right: number, bottom: number): void {
        super.onLayout(left, top, right, bottom);

        const insets = this.getSafeAreaInsets();
        if (this.orientation === "vertical") {
            this.layoutVertical(left, top, right, bottom, insets);
        }
        else {
            this.layoutHorizontal(left, top, right, bottom, insets);
        }
    }

    private layoutVertical(left: number, top: number, right: number, bottom: number, insets: { left, top, right, bottom }): void {
        const paddingLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft + insets.left;
        const paddingTop = this.effectiveBorderTopWidth + this.effectivePaddingTop + insets.top;
        const paddingRight = this.effectiveBorderRightWidth + this.effectivePaddingRight + insets.right;
        const paddingBottom = this.effectiveBorderBottomWidth + this.effectivePaddingBottom + insets.bottom;

        let childTop: number;
        let childLeft: number = paddingLeft;
        let childRight = right - left - paddingRight;

        switch (this.verticalAlignment) {
            case VerticalAlignment.MIDDLE:
                childTop = (bottom - top - this._totalLength) / 2 + paddingTop - paddingBottom;
                break;

            case VerticalAlignment.BOTTOM:
                childTop = bottom - top - this._totalLength + paddingTop - paddingBottom;
                break;

            case VerticalAlignment.TOP:
            case VerticalAlignment.STRETCH:
            default:
                childTop = paddingTop;
                break;
        }

        this.eachLayoutChild((child, last) => {
            const childHeight = child.getMeasuredHeight() + child.effectiveMarginTop + child.effectiveMarginBottom;

            View.layoutChild(this, child, childLeft, childTop, childRight, childTop + childHeight);
            childTop += childHeight;
        });
    }

    private layoutHorizontal(left: number, top: number, right: number, bottom: number, insets: { left, top, right, bottom }): void {
        const paddingLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft + insets.left;
        const paddingTop = this.effectiveBorderTopWidth + this.effectivePaddingTop + insets.top;
        const paddingRight = this.effectiveBorderRightWidth + this.effectivePaddingRight + insets.right;
        const paddingBottom = this.effectiveBorderBottomWidth + this.effectivePaddingBottom + insets.bottom;

        let childTop: number = paddingTop;
        let childLeft: number;
        let childBottom = bottom - top - paddingBottom;

        switch (this.horizontalAlignment) {
            case HorizontalAlignment.CENTER:
                childLeft = (right - left - this._totalLength) / 2 + paddingLeft - paddingRight;
                break;

            case HorizontalAlignment.RIGHT:
                childLeft = right - left - this._totalLength + paddingLeft - paddingRight;
                break;

            case HorizontalAlignment.LEFT:
            case HorizontalAlignment.STRETCH:
            default:
                childLeft = paddingLeft;
                break;
        }

        this.eachLayoutChild((child, last) => {
            const childWidth = child.getMeasuredWidth() + child.effectiveMarginLeft + child.effectiveMarginRight;

            View.layoutChild(this, child, childLeft, childTop, childLeft + childWidth, childBottom);
            childLeft += childWidth;
        });
    }

    private isUnsizedScrollableView(child: View): boolean {
        if (child.height === "auto" && (child.ios instanceof UITableView || child.ios instanceof UIScrollView)) {
            return true;
        }

        return false;
    }
}