Ideal Height for Admob Native ads in Flutter(Medium size, not small)

ios swift flutter dart admob

344

I summed height of all elements in the design. It was 308. Then, I think 310 will be an ideal number. No problem, when I make it 310. Everything seems good.

344

Author by

gurkan stack

Updated on January 03, 2023

Comments

gurkan stack over 1 year

I am trying to show native ads in Flutter.

https://codelabs.developers.google.com/codelabs/admob-inline-ads-in-flutter

https://github.com/googlecodelabs/admob-inline-ads-in-flutter

I used this codelab but they are showing small native ads.

In fact, I successfully implemented their codelab in my Flutter project.

But I want to make size medium, not small.

https://developers.google.com/admob/ios/native/templates

GADTSmallTemplateView(It seems this one, I don't want like small size)

GADTMediumTemplateView(My aim is to make my native ads like this one)

What is height in the codelab?

return Container(
            child: AdWidget(ad: _ad),
            height: 72.0,
            alignment: Alignment.center,
          )

In the codelab, they used height: 72. When I make it 72, I get the same size like picture above.

What is my aim?

I want to make native ads like GADTMediumTemplateView(bigger). I maked height to 400

   return Container(
                child: AdWidget(ad: _ad),
                height: 400.0,
                alignment: Alignment.center,
              )

but it does not look good in iPhone 13. (Besides, I don't know it complies with Admob policies or not. I researched on the internet but I did not find a clear solution.) It is very huge especially in landscape mode(it covers 90% of the screen)(For portrait mode it covers %40 of the screen).

As a result, I want an ideal number for this situation(or any other solution). It is a flutter project, iOS side is priorty for me(it should be compatible with all iphones & ipads. From iPhone 5S to iPhone 13 Pro Max. or ipads)

https://www.ios-resolution.com

Finally, what is the ideal number for height? 250? 100? 300? 200? Or any other solution? (Our width seems match parent, it seems that no modification is needed for width but I am not sure, I am open to any advice )

EDIT:

Omatt commented for me to edit my question. I'm detailing my question. Thanks for any help.

What do I get with 400 height?

What do I want?

I want to implement responsive(all iPhones & iPads), policy compliant & good looking native ads.

ListTileNativeAdView:

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="19529" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" colorMatched="YES">
    <device id="retina4_7" orientation="portrait" appearance="light"/>
    <dependencies>
        <deployment version="2048" identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="19519"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <objects>
        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
        <view contentMode="scaleToFill" id="iN0-l3-epB" customClass="GADNativeAdView">
            <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
            <subviews>
                <imageView userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="iNa-bH-h1m">
                    <rect key="frame" x="15" y="15.5" width="40" height="40"/>
                    <constraints>
                        <constraint firstAttribute="height" constant="40" id="ICz-3W-FQf"/>
                        <constraint firstAttribute="width" constant="40" id="vY6-8D-xIn"/>
                    </constraints>
                </imageView>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Advertiser" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="GTT-Yh-eSq">
                    <rect key="frame" x="63" y="38.5" width="66.5" height="17"/>
                    <fontDescription key="fontDescription" type="system" pointSize="14"/>
                    <color key="textColor" systemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
                <imageView userInteractionEnabled="NO" contentMode="scaleToFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" placeholderIntrinsicWidth="100" placeholderIntrinsicHeight="17" translatesAutoresizingMaskIntoConstraints="NO" id="2Of-AP-0h9">
                    <rect key="frame" x="129.5" y="38.5" width="100" height="17"/>
                    <constraints>
                        <constraint firstAttribute="height" constant="17" id="jBW-Cz-Kyc"/>
                        <constraint firstAttribute="width" constant="100" id="sXk-zk-NI0"/>
                    </constraints>
                </imageView>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" verticalCompressionResistancePriority="751" text="Body that is really really long and can take up to two lines or sometimes even more." textAlignment="justified" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="PEQ-D9-2Vv">
                    <rect key="frame" x="15" y="63.5" width="350" height="33.5"/>
                    <fontDescription key="fontDescription" type="system" pointSize="14"/>
                    <color key="textColor" systemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Price" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Ysb-of-cat">
                    <rect key="frame" x="230" y="268" width="33" height="17"/>
                    <fontDescription key="fontDescription" type="system" pointSize="14"/>
                    <color key="textColor" systemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Store" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="hwF-UL-Q8H">
                    <rect key="frame" x="273" y="268" width="35" height="17"/>
                    <fontDescription key="fontDescription" type="system" pointSize="14"/>
                    <color key="textColor" systemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" verticalHuggingPriority="251" horizontalCompressionResistancePriority="751" text="Headline" textAlignment="justified" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="beR-eV-DX1">
                    <rect key="frame" x="63" y="10" width="297" height="20.5"/>
                    <constraints>
                        <constraint firstAttribute="height" constant="20.5" id="6r8-Hu-d0y"/>
                    </constraints>
                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
                    <color key="textColor" systemColor="darkTextColor"/>
                    <nil key="highlightedColor"/>
                </label>
                <view contentMode="scaleAspectFit" translatesAutoresizingMaskIntoConstraints="NO" id="fNp-yu-K4i" customClass="GADMediaView">
                    <rect key="frame" x="62.5" y="102" width="250" height="150"/>
                    <constraints>
                        <constraint firstAttribute="height" priority="750" constant="150" id="71m-kn-7Ug"/>
                        <constraint firstAttribute="width" constant="250" id="e3T-fD-di4"/>
                    </constraints>
                </view>
                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Ad" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="lp1-oz-XOs">
                    <rect key="frame" x="0.0" y="0.0" width="15" height="15"/>
                    <color key="backgroundColor" red="1" green="0.80000001190000003" blue="0.40000000600000002" alpha="1" colorSpace="calibratedRGB"/>
                    <constraints>
                        <constraint firstAttribute="width" relation="greaterThanOrEqual" constant="15" id="Twa-Vk-uWQ"/>
                        <constraint firstAttribute="height" constant="15" id="k8m-kJ-CF5"/>
                    </constraints>
                    <fontDescription key="fontDescription" type="system" weight="semibold" pointSize="11"/>
                    <color key="textColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                    <nil key="highlightedColor"/>
                </label>
                <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="E5w-YA-UY8">
                    <rect key="frame" x="318" y="259.5" width="47" height="34"/>
                    <fontDescription key="fontDescription" type="system" pointSize="18"/>
                    <state key="normal" title="Install">
                        <color key="titleShadowColor" red="0.5" green="0.5" blue="0.5" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                    </state>
                </button>
            </subviews>
            <color key="backgroundColor" red="1" green="0.98303861469999998" blue="0.92887652860000003" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
            <constraints>
                <constraint firstItem="GTT-Yh-eSq" firstAttribute="leading" secondItem="beR-eV-DX1" secondAttribute="leading" id="0sB-Mk-EU6"/>
                <constraint firstItem="lp1-oz-XOs" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" id="3lA-qv-Nkc"/>
                <constraint firstItem="Ysb-of-cat" firstAttribute="leading" relation="greaterThanOrEqual" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="3pc-w6-uy1"/>
                <constraint firstItem="PEQ-D9-2Vv" firstAttribute="top" relation="greaterThanOrEqual" secondItem="iNa-bH-h1m" secondAttribute="bottom" id="4S3-p0-z6A"/>
                <constraint firstAttribute="trailing" secondItem="PEQ-D9-2Vv" secondAttribute="trailing" constant="10" id="8U0-Fb-3R7"/>
                <constraint firstItem="iNa-bH-h1m" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="15" id="9WK-zC-xET"/>
                <constraint firstAttribute="trailing" secondItem="beR-eV-DX1" secondAttribute="trailing" constant="15" id="BcE-do-dNl"/>
                <constraint firstItem="lp1-oz-XOs" firstAttribute="left" secondItem="iN0-l3-epB" secondAttribute="left" id="BpX-yC-PZG"/>
                <constraint firstItem="PEQ-D9-2Vv" firstAttribute="top" secondItem="2Of-AP-0h9" secondAttribute="bottom" constant="8" symbolic="YES" id="CCg-xe-cKg"/>
                <constraint firstItem="2Of-AP-0h9" firstAttribute="top" secondItem="beR-eV-DX1" secondAttribute="bottom" constant="8" symbolic="YES" id="ESC-Pe-TXR"/>
                <constraint firstItem="iNa-bH-h1m" firstAttribute="bottom" secondItem="2Of-AP-0h9" secondAttribute="bottom" id="GwM-y0-1du"/>
                <constraint firstItem="beR-eV-DX1" firstAttribute="leading" secondItem="iNa-bH-h1m" secondAttribute="trailing" constant="8" symbolic="YES" id="MRN-dd-Oip"/>
                <constraint firstItem="2Of-AP-0h9" firstAttribute="leading" secondItem="GTT-Yh-eSq" secondAttribute="trailing" id="Med-Nd-wEo"/>
                <constraint firstItem="beR-eV-DX1" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" constant="10" id="Mvs-eV-Wzb"/>
                <constraint firstItem="Ysb-of-cat" firstAttribute="centerY" secondItem="hwF-UL-Q8H" secondAttribute="centerY" id="Rud-i8-Myz"/>
                <constraint firstItem="fNp-yu-K4i" firstAttribute="centerX" secondItem="iN0-l3-epB" secondAttribute="centerX" id="TYN-lq-3DK"/>
                <constraint firstItem="fNp-yu-K4i" firstAttribute="top" secondItem="PEQ-D9-2Vv" secondAttribute="bottom" constant="5" id="V0m-hf-6NS"/>
                <constraint firstItem="GTT-Yh-eSq" firstAttribute="centerY" secondItem="2Of-AP-0h9" secondAttribute="centerY" id="YgR-kp-age"/>
                <constraint firstItem="hwF-UL-Q8H" firstAttribute="leading" secondItem="Ysb-of-cat" secondAttribute="trailing" constant="10" id="aLb-sm-wAb"/>
                <constraint firstAttribute="right" relation="greaterThanOrEqual" secondItem="lp1-oz-XOs" secondAttribute="right" constant="20" symbolic="YES" id="czi-qD-IaJ"/>
                <constraint firstAttribute="trailing" secondItem="E5w-YA-UY8" secondAttribute="trailing" constant="10" id="eNM-dN-tvx"/>
                <constraint firstItem="E5w-YA-UY8" firstAttribute="leading" secondItem="hwF-UL-Q8H" secondAttribute="trailing" constant="10" id="f39-vH-KWq"/>
                <constraint firstItem="iNa-bH-h1m" firstAttribute="leading" secondItem="PEQ-D9-2Vv" secondAttribute="leading" id="mof-5F-8vM"/>
                <constraint firstItem="E5w-YA-UY8" firstAttribute="centerY" secondItem="hwF-UL-Q8H" secondAttribute="centerY" id="rNj-VY-YrO"/>
                <constraint firstItem="E5w-YA-UY8" firstAttribute="top" secondItem="fNp-yu-K4i" secondAttribute="bottom" constant="7.5" id="rup-e7-1CR"/>
                <constraint firstAttribute="bottom" relation="greaterThanOrEqual" secondItem="E5w-YA-UY8" secondAttribute="bottom" constant="20" symbolic="YES" id="uEI-XT-igi"/>
            </constraints>
            <connections>
                <outlet property="advertiserView" destination="GTT-Yh-eSq" id="bY8-5O-6fF"/>
                <outlet property="bodyView" destination="PEQ-D9-2Vv" id="Gpd-Q6-Byv"/>
                <outlet property="callToActionView" destination="E5w-YA-UY8" id="RCf-yK-s1x"/>
                <outlet property="headlineView" destination="beR-eV-DX1" id="d1E-ed-yel"/>
                <outlet property="iconView" destination="iNa-bH-h1m" id="gIe-xy-iwm"/>
                <outlet property="mediaView" destination="fNp-yu-K4i" id="624-ZP-L04"/>
                <outlet property="priceView" destination="Ysb-of-cat" id="L6Q-hd-uaJ"/>
                <outlet property="starRatingView" destination="2Of-AP-0h9" id="zCO-9D-S0V"/>
                <outlet property="storeView" destination="hwF-UL-Q8H" id="hRl-23-ce1"/>
            </connections>
            <point key="canvasLocation" x="13.6" y="-5.8470764617691158"/>
        </view>
    </objects>
    <resources>
        <systemColor name="darkTextColor">
            <color white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
        </systemColor>
    </resources>
</document>

Omatt about 2 years

Your issue seems to pertain with Google AdMob scaling on iOS with Flutter. You may want to consider updating the question to be clear. Adding images of the expected and current behavior will also help.
gurkan stack about 2 years

I will edit my question with extra designs. Thanks for your feedback.