Android এর জন্য IMA SDK সহ কাস্টম UI

এই গাইডটি দেখায় কিভাবে Android এর জন্য IMA SDK ব্যবহার করে আপনার নিজস্ব কাস্টম UI বাস্তবায়ন করবেন। এটি করার জন্য, আপনাকে ডিফল্ট UI অক্ষম করতে হবে, একটি নতুন কাস্টম UI সেট আপ করতে হবে এবং তারপর SDK থেকে প্রাপ্ত বিজ্ঞাপনের তথ্য দিয়ে নতুন UI তৈরি করতে হবে৷

বিজ্ঞাপন UI নিষ্ক্রিয় করুন

একটি কাস্টম UI দেখাতে, প্রথমে আপনাকে ডিফল্ট বিজ্ঞাপন UI নিষ্ক্রিয় করতে হবে৷ এটি করার জন্য, AdsRenderingSettings.setDisableUi() এ কল করুন এবং তারপর AdsManager.init()AdsRenderingSettings পাস করুন :

MyActivity.java

ImaSdkFactory mSdkFactory = ImaSdkFactory.getInstance();
AdsManager mAdsManager;

@Override
public void onAdsManagerLoaded(AdsManagerLoadedEvent adsManagerLoadedEvent) {
    mAdsManager = adsManagerLoadedEvent.getAdsManager();

    ...
    AdsRenderingSettings settings = mSdkFactory.createAdsRenderingSettings();
    settings.setDisableUi(true);
    mAdsManager.init(settings);
}

এরপরে, যখনই আপনার কাস্টম UI দেখাবেন কিনা তা সিদ্ধান্ত নিতে হবে, একটি বিজ্ঞাপন আছে কিনা তা পরীক্ষা করে দেখুন এবং Ad.isUiDisabled() কে কল করে চেক করুন যে ডিফল্ট বিজ্ঞাপন UI অক্ষম করা হয়েছে।

কাস্টম UI দেখান

একবার ডিফল্ট UI নিষ্ক্রিয় হয়ে গেলে, পরবর্তী ধাপ হল একটি কাস্টম বিজ্ঞাপন UI দেখানো। এই উদাহরণের জন্য, আপনার বিদ্যমান ভিডিও প্লেয়ার লেআউটে একটি নতুন RelativeLayout যোগ করুন, তারপর একটি বিজ্ঞাপন যখন চলছে তখন এই লেআউটটি দেখান এবং কোনো বিজ্ঞাপন না চলা অবস্থায় এটি লুকান৷

ফ্র্যাগমেন্ট লেআউট ফাইলে নিম্নলিখিত যোগ করুন:

fragment_video.xml

<com.google.ads.interactivemedia.v3.samples.samplevideoplayer.SampleVideoPlayer
    android:id="@+id/sampleVideoPlayer"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
<RelativeLayout
        android:id="@+id/customUi"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible">
                <TextView
                    android:id="@+id/adCounter"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@android:color/holo_green_light"
                    android:layout_alignParentTop="true"
                    android:layout_alignParentLeft="true"
                    android:text="@string/ad_counter" />
                <Button
                  android:id="@+id/learnMoreButton"
                  android:background="@android:color/holo_green_light"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_alignParentTop="true"
                  android:text="@string/learn_more"
                  android:layout_alignParentRight="true" />
                <Button
                  android:id="@+id/skipButton"
                  android:background="@android:color/holo_green_light"
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_alignParentBottom="true"
                  android:text="@string/skip_ad"
                  android:enabled="false"
                  android:layout_alignParentRight="true" />
</RelativeLayout>

তারপর Activity কাস্টম UI ব্যবহার করতে কোড যোগ করুন। UI আপডেট করতে, একটি টাইমার Handler এবং একটি Runnable তৈরি করুন যা এটিতে চলে।

MyActivity.java

// The view containing the custom UI.
private View mCustomUi;
// The timer handler.
private Handler mTimerHandler = new Handler();

// The Runnable that runs your custom UI update loop.
private Runnable mTimerRunnable = new Runnable() {
    @Override
    public void run() {
        updateCustomUi();
        mTimerHandler.postDelayed(this, 500);
    }
};

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
...
    mCustomUi = rootView.findViewById(R.id.customUi);
    mAdCounterUi = (TextView) rootView.findViewById(R.id.adCounter);
}

@Override
public void onAdEvent(AdEvent adEvent) {
    ...
    switch (adEvent.getType()) {
        ...
            case STARTED:
            // Start your update loop.
            mTimerHandler.post(mTimerRunnable);
            Break;
                ...
        case COMPLETED:
            mCustomUi.setVisibility(View.INVISIBLE);
            mTimerHandler.removeCallbacks(mTimerRunnable);
            ...
    }
}

@Override
public void onPause() {
...
    // Stop ad UI update loop.
    mTimerHandler.removeCallbacks(mTimerRunnable);
}

@Override
Public void onResume() {
...
    // Start ad UI update loop.
    mTimerHandler.post(mTimerRunnable);
}

বিজ্ঞাপন কাউন্টার এবং স্কিপ বোতাম

এখন বিজ্ঞাপনের তথ্য দিয়ে UI পূরণ করতে updateCustomUi() ফাংশনটি সংজ্ঞায়িত করুন। বিজ্ঞাপনের ফর্ম্যাট অনুসারে বিশদগুলি পরিবর্তিত হয়, তবে আপনি সাধারণত বিজ্ঞাপন কাউন্টার এবং একটি এড়িয়ে যাওয়ার বোতাম বা এড়িয়ে যাওয়ার কাউন্টার অন্তর্ভুক্ত করেন যদি বিজ্ঞাপনটি এড়ানো যায়। নিম্নলিখিত যোগ করুন:

MyActivity.java

private void updateCustomUi() {
    // Runs from the update loop to update the custom UI.
    Ad ad = mAdsManager.getCurrentAd();
    if (ad != null && ad.isUiDisabled()) {
        // Show the UI.
        Log.i(LOGTAG, "UI disabled, show custom UI!");
        AdPodInfo podInfo = ad.getAdPodInfo();
        VideoProgressUpdate update = mAdsManager.getAdProgress();
        SimpleDateFormat format = new SimpleDateFormat("mm:ss", Locale.US);

        // Handle ad counter.
        String adProgress = format.format(
                (update.getDuration() - update.getCurrentTime()) * 1000);
        String adUiString = String.format(
                Locale.US, "Ad %d of %d (%s)", podInfo.getAdPosition(),
                podInfo.getTotalAds(), adProgress);
        mAdCounterUi.setText(adUiString);

        // Handle skippable ads.
        if (ad.isSkippable()) {
            if (update.getCurrentTime() >= ad.getSkipTimeOffset()) {
                // Allow skipping.
                mSkipButton.setText(getString(R.string.skip_ad));
                mSkipButton.setEnabled(true);
            } else {
                String skipString = String.format(
                        Locale.US, "You can skip this ad in %d",
                        (int) (ad.getSkipTimeOffset() -
                                update.getCurrentTime()));
                mSkipButton.setText(skipString);
                mSkipButton.setEnabled(false);
            }
            mSkipButton.setVisibility(View.VISIBLE);
        } else {
            mSkipButton.setVisibility(View.INVISIBLE);
        }
        mCustomUi.setVisibility(View.VISIBLE);
        mCustomUi.bringToFront();
    } else {
        // Hide the UI.
        mCustomUi.setVisibility(View.INVISIBLE);
        mTimerHandler.removeCallbacks(mTimerRunnable);
    }
}

পূর্ববর্তী কোডে, একটি বিজ্ঞাপন আছে কিনা তা পরীক্ষা করার পরে এবং ডিফল্ট বিজ্ঞাপন UI নিষ্ক্রিয় করা হয়েছে কিনা তা পরীক্ষা করার জন্য Ad.isUiDisabled() কল করার পরে, পডে বিজ্ঞাপনের অবস্থান এবং বিজ্ঞাপনের অগ্রগতি খুঁজে পেতে Ad.getAdPodInfo() এবং AdsManager.getAdProgress() এ কল করুন। এড়িয়ে যাওয়া বিজ্ঞাপনগুলির জন্য, আপনি যদি এখনও বিজ্ঞাপনটি এড়িয়ে যেতে না পারেন তবে একটি স্কিপ কাউন্টার দেখান; অন্যথায়, একটি স্কিপ বোতাম দেখান। এখানে সাধারণ বিজ্ঞাপন তথ্য এবং সংশ্লিষ্ট কলগুলির একটি সারসংক্ষেপ রয়েছে:

তথ্য কল
পড বর্তমান বিজ্ঞাপন Ad.getAdPodInfo().getAdPosition()
পড মোট বিজ্ঞাপন Ad.getPodInfo().getTotalAds()
বিজ্ঞাপন এড়ানো যায় Ad.isSkippable()
সেকেন্ড পর্যন্ত বিজ্ঞাপন এড়িয়ে যাওয়া যাবে Ad.getSkipTimeOffset() - AdsManager.getAdProgress().getCurrentTime()
বিজ্ঞাপন বাকি সেকেন্ড (AdsManager.getAdProgress().getDuration() - AdsManager.getAdProgress().getCurrentTime()) * 1000

Skip Ad বাটনে ক্লিক করলে বিজ্ঞাপনটি এড়িয়ে যাওয়া উচিত, তাই আরও জানুন বোতাম ছাড়াও সেটি সেট আপ করুন:

MyActivity.java

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
...
mCustomUi = rootView.findViewById(R.id.customUi);
mAdCounterUi = (TextView) rootView.findViewById(R.id.adCounter);

// Set up the 'learn more' button handler for the custom UI.
mLearnMoreButton = (Button) rootView.findViewById(R.id.learnMoreButton);
mLearnMoreButton.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View view) {
        // Only works if the UI has been disabled.
        mAdsManager.clicked();
    }
});

// Set up the skip button handler for the custom UI.
mSkipButton = (Button) rootView.findViewById(R.id.skipButton);
mSkipButton.setOnClickListener(new OnClickListener() {
    @Override
    public void onClick(View view) {
        mAdsManager.skip();
    }
});

AdsManager.clicked() কাজ করার জন্য UI অক্ষম করতে হবে।

সমস্যা সমাধান

আপনার কি এমন একটি নমুনা ট্যাগ আছে যা বিজ্ঞাপন UI নিষ্ক্রিয় করার জন্য সক্ষম করা হয়েছে?
আপনি এই নমুনা ট্যাগের URL টি কপি করে আপনার IMA বাস্তবায়নে পেস্ট করতে পারেন।
আমি ডিফল্ট UI নিষ্ক্রিয় করতে পারি না।
আপনি AdsRenderingSettings.setDisableUi() কল করেছেন এবং এটি AdsManager এ পাস করেছেন তা নিশ্চিত করতে পরীক্ষা করুন। Ad.isUiDisabled() true দেখায় তা দেখতে পরীক্ষা করুন। উপরন্তু, একটি বিজ্ঞাপন UI অক্ষম করতে আপনার নেটওয়ার্ক অবশ্যই Ad Manager-এ সক্রিয় থাকতে হবে। আপনি সক্ষম হলে, আপনার VAST-এ একটি Extension রয়েছে যা দেখতে এইরকম:
<Extension type="uiSettings">
<UiHideable>1</UiHideable>
</Extension>
আপনি যদি এখনও সমস্যায় পড়ে থাকেন তবে আপনি সক্ষম হয়েছেন তা নিশ্চিত করতে আপনার অ্যাকাউন্ট পরিচালকের সাথে যোগাযোগ করুন৷ কিছু বিজ্ঞাপন প্রকারের জন্য একটি নির্দিষ্ট UI প্রয়োজন; এই বিজ্ঞাপনগুলি 0-এর <UiHideable> মান দিয়ে ফিরে আসে। আপনি যদি এটির সম্মুখীন হন, তাহলে আপনার পাচারকারী দলকে এই ধরনের বিজ্ঞাপনগুলি পরিবেশন করা হয় না তা যাচাই করার জন্য পরিবর্তন করতে হবে।