3

I’m implementing the Native Ads in Android using Native Ads - Huawei documentation. When I come across to change the height of the MediaView according to Screen Size (0 dp), I have found that it couldn't be changed.

Even though I have implemented the setOnHierarchyChangeListener, but it doesn't work either. The following is what I have achieved currently.

File native_ad.xml

<com.huawei.hms.ads.nativead.NativeView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/native_video_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerInParent="true"
    android:background="#FFFFFF"
    android:orientation="vertical">
      <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <com.huawei.hms.ads.nativead.MediaView
                android:id="@+id/ad_media"
                android:layout_width="0dp"
                android:layout_height="0dp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHeight_percent="0.8"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toTopOf="@id/constraintLayout"/>

            <androidx.constraintlayout.widget.ConstraintLayout
                android:id="@+id/constraintLayout"
                android:layout_width="0dp"
                android:layout_height="0dp"
                app:layout_constraintHeight_percent="0.2"
                android:background="@drawable/white_bg"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@id/ad_media">

                <TextView
                    ... />

                <TextView
                    ... />

                <TextView
                  .. />

                <Button
                   ... />

            </androidx.constraintlayout.widget.ConstraintLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>

    </com.huawei.hms.ads.nativead.NativeView>

Function inItNativeAdView

private fun initNativeAdView(nativeAd: NativeAd?, nativeView: NativeView) {
    nativeView.titleView = nativeView.findViewById(R.id.ad_title)
    (nativeView.titleView as TextView).text = nativeAd!!.title

    nativeView.mediaView = nativeView.findViewById(R.id.ad_media)
    nativeView.mediaView.setMediaContent(nativeAd.mediaContent)
    nativeView.mediaView.setOnHierarchyChangeListener(object : OnHierarchyChangeListener {
        override fun onChildViewAdded(parent: View, child: View) {
          *//*  if (child is ImageView) {
                val imageView: ImageView = child as ImageView
                imageView.adjustViewBounds = true
            }*//*
            val scale = context.resources.displayMetrics.density

            val maxHeightPixels = 175
            val maxHeightDp = (maxHeightPixels * scale + 0.5f).toInt()

            if (child is ImageView) { //Images
                val imageView = child
                imageView.adjustViewBounds = true
                imageView.maxHeight = maxHeightDp
            } else { //Videos
                val params = child.layoutParams
                params.height = maxHeightDp
                child.layoutParams = params
            }
        }

        override fun onChildViewRemoved(parent: View, child: View) {}
    })
}

Implementation of setOnHierarchyChangeListener doesn't change the height of the mediaView.

Currently I’m viewing the native ads as follows:

Enter image description here

I expect something like this with the dynamic mediaView:

Enter image description here

How can I fix this?

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
waheed shah
  • 494
  • 7
  • 19

3 Answers3

2

Automatically filling the screen or the portion of a screen by the current widget only works for LinearLayout.

In the sample XML file, a relative layout is used. To make the 0dp plus layout_weight control work with MediaView, please change the layout to Linear from Relative in the native_small_template.xml file in the sample code as shown below. The image from Native ads will be scaled accordingly as shown in the image below.

For using ContraintLayout, please use app:layout_constraintVertical_weight="1", or app:layout_constraintHorizontal_weight="1", depending on the layout design, to make it scalable.

Enter image description here

Enter image description here

To answer your further question:

For videos, it is better not to change the aspect ratio as ttljtw said.

But changing the vertical size based on video width could be implemented using the same principle used for images. The display width could be set in the init process. A percentage of some dimension could be used to set the display width through the layoutParams.width property.

Enter image description here

Enter image description here

Scale up the video width example is give below

This could be set it in the “initNativeAdView” if following the original sample code name.

Enter image description here

Scale is shown here:

Enter image description here

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
Zinna
  • 1,947
  • 2
  • 5
  • 20
  • My testing id is for video view in media view not the image view. This wont work as I need percent height not the app:layout_constraintVertical_weight="1" – waheed shah Oct 26 '21 at 09:31
  • This is the result of the media view. Please have look at https://ibb.co/thLMv9T. I m using layout_constrainVertical_weight = "1" – waheed shah Oct 26 '21 at 09:34
  • @waheedshah more info. added to my answer. – Zinna Oct 26 '21 at 17:27
  • I can decrease the size of the video according to my phones width but Scaling of the video with that script doesn't work. I have already tried it out. – waheed shah Oct 27 '21 at 06:52
  • @waheedshah added more info. yesterday, please check. thx – Zinna Oct 29 '21 at 05:15
1

According to our analysis, if initNativeAdView is not invoked, the ads layout is also generated, but the ads content is missing. It follows that ImageView is not loaded after getting ads. Therefore, setting the height through OnHierarchyChangeListener is not feasible.

However, you can set the height of the MediaView directly like following:

        MediaView mediaView = nativeView.getMediaView();
        ViewGroup.LayoutParams params = mediaView.getLayoutParams();
        params.height = 200;
        mediaView.setLayoutParams(params);

Enter image description here


You could try to change MediaView like the following:

<com.huawei.hms.ads.nativead.MediaView
                android:id="@+id/ad_media"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHeight_percent="0.8"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toTopOf="@id/constraintLayout"/>
Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
zhangxaochen
  • 32,744
  • 15
  • 77
  • 108
  • That isn't working bcz i thing we have to give percent Height to only those view that should match constraint according to screen size. If I put wrap content in height that wont work. – waheed shah Oct 21 '21 at 09:29
  • hi@waheed shah, i updated my answer, pls kindly refer to that. – zhangxaochen Oct 26 '21 at 08:48
  • 1
    hi @shirley Thanks for your response. Is this for image in mediaView? I m using the video in media view. I have also used this nativeView.mediaView.setImageScaleType(ImageView.ScaleType.FIT_XY) but that won't help too bcz its for image view. – waheed shah Oct 26 '21 at 09:18
  • 1
    So Here is link https://ibb.co/4FrHRkT with layout_height = 0dp and above script in native ad class. – waheed shah Oct 26 '21 at 09:26
  • For video in mediaView, the same applies, pls kindly check this [pic](https://i.stack.imgur.com/bRv8f.jpg). – zhangxaochen Oct 26 '21 at 09:28
  • Can you please increase its size.. I have use this code. val mediaView: MediaView = nativeView.mediaView val param: ViewGroup.LayoutParams = mediaView.layoutParams param.height = 900; mediaView.layoutParams = param with layout_height = 0dp. That was the result in attached link in above comment. – waheed shah Oct 26 '21 at 09:36
1

The aspect ratio of the video is fixed. Why do you have to set the height beyond the width of the screen?

I think the ad provider will consider the effect of the ad and limit the size of the material. As the previous picture you post, the white space supplements the heights that the video can't reach.

Or you can use Layout Inspector in Android Studio, find the video's layout element and modify it. However, this can be complicated and prone to problems.

Enter image description here

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
ttljtw
  • 51
  • 4