Marco Papula
Marco Papula

Reputation: 841

IOS Splash Screen renders correctly then elements jump to top

So I have the following Splash Screen:

enter image description here

Which loads up normally but then jumps to the following:

enter image description here

My constraints are the following :S So I think I have my elements properly constrained and also when checking the different devices in xcode everything looks okay. But as soon as the app starts it initally loads correctly but before loading the next view everything jumps to the top.

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="16096" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
<device id="retina3_5" orientation="portrait" appearance="light"/>
<dependencies>
    <deployment identifier="iOS"/>
    <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="16086"/>
    <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
    <!--View Controller-->
    <scene sceneID="EHf-IW-A2E">
        <objects>
            <viewController id="01J-lp-oVM" sceneMemberID="viewController">
                <layoutGuides>
                    <viewControllerLayoutGuide type="top" id="Ydg-fD-yQy"/>
                    <viewControllerLayoutGuide type="bottom" id="xbc-2k-c8Z"/>
                </layoutGuides>
                <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
                    <rect key="frame" x="0.0" y="0.0" width="320" height="480"/>
                    <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                    <subviews>
                        <imageView opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleAspectFill" image="LaunchImage" translatesAutoresizingMaskIntoConstraints="NO" id="YRO-k0-Ey4">
                            <rect key="frame" x="0.0" y="0.0" width="320" height="480"/>
                        </imageView>
                        <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="growthdecks_logo_white" translatesAutoresizingMaskIntoConstraints="NO" id="oIG-AW-V5d">
                            <rect key="frame" x="38" y="110" width="245" height="260.5"/>
                        </imageView>
                        <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="millesanders_logo_white" translatesAutoresizingMaskIntoConstraints="NO" id="RMx-ME-VmL">
                            <rect key="frame" x="103" y="398" width="115" height="82"/>
                            <constraints>
                                <constraint firstAttribute="height" constant="82" id="rA5-25-iAt"/>
                            </constraints>
                        </imageView>
                    </subviews>
                    <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                    <constraints>
                        <constraint firstItem="RMx-ME-VmL" firstAttribute="leading" secondItem="Ze5-6b-2t3" secondAttribute="leadingMargin" constant="87" id="40k-Ob-jLK"/>
                        <constraint firstAttribute="trailingMargin" secondItem="oIG-AW-V5d" secondAttribute="trailing" constant="21" id="8zN-eu-A0s"/>
                        <constraint firstAttribute="trailing" secondItem="YRO-k0-Ey4" secondAttribute="trailing" id="CfB-dj-2FI"/>
                        <constraint firstAttribute="trailingMargin" secondItem="RMx-ME-VmL" secondAttribute="trailing" constant="86" id="D7Z-vK-LvD"/>
                        <constraint firstItem="YRO-k0-Ey4" firstAttribute="leading" secondItem="Ze5-6b-2t3" secondAttribute="leading" id="Heg-3Y-CWr"/>
                        <constraint firstItem="oIG-AW-V5d" firstAttribute="leading" secondItem="Ze5-6b-2t3" secondAttribute="leadingMargin" constant="22" id="QGg-5c-RsU"/>
                        <constraint firstItem="YRO-k0-Ey4" firstAttribute="top" secondItem="Ze5-6b-2t3" secondAttribute="top" id="ZYU-cd-jlT"/>
                        <constraint firstItem="oIG-AW-V5d" firstAttribute="top" secondItem="Ydg-fD-yQy" secondAttribute="bottom" constant="110" id="nP2-0E-Opq"/>
                        <constraint firstItem="xbc-2k-c8Z" firstAttribute="top" secondItem="RMx-ME-VmL" secondAttribute="bottom" id="qQf-sf-irV"/>
                        <constraint firstAttribute="bottom" secondItem="YRO-k0-Ey4" secondAttribute="bottom" id="uzq-64-XwI"/>
                    </constraints>
                </view>
            </viewController>
            <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
        </objects>
        <point key="canvasLocation" x="75.362318840579718" y="250.44642857142856"/>
    </scene>
</scenes>
<resources>
    <image name="LaunchImage" width="2344.5" height="5075"/>
    <image name="growthdecks_logo_white" width="261" height="260.5"/>
    <image name="millesanders_logo_white" width="1152.5" height="260.5"/>
</resources>

I am using flutter but I think this is a native ios issue :S This is what it looks like in xcode

enter image description here

Upvotes: 4

Views: 1408

Answers (3)

Mark Heiman
Mark Heiman

Reputation: 61

Check that your constraints are referencing the Superview rather than the Layout:

  1. Click on the specific constraint in the list to the left of the preview
  2. In the Inspector to the right of the preview (select menu View -> Inspectors -> Show Inspector if it's not visible) show the Attributes Inspector by clicking the three sliders icon.
  3. Look at the First Item and Second Item entry. If either of them references Layout, click the menu and select Superview instead.
  4. Repeat for the remaining constraints. Save and build.

Upvotes: 6

Marco Papula
Marco Papula

Reputation: 841

I was constraining my logos to the layout instead of the superview along the vertical axis. :S That did the trick for me

Upvotes: 1

Anil Kumar
Anil Kumar

Reputation: 1984

Set image as a aspect fit from launch.storyboard

Upvotes: 0

Related Questions