ข้ามไปยังเนื้อหา

การปรับแต่งลักษณะที่ปรากฏของริชมีเดีย

ภาพรวม

Anchor link to

ปรับแต่งลักษณะที่ปรากฏของหน้าริชมีเดียเพื่อให้เข้ากับสไตล์แอปของคุณได้อย่างสมบูรณ์แบบ เปลี่ยนสีพื้นหลังของข้อความในแอปของคุณ เพิ่มแอนิเมชัน หรือปรับมุมมองการโหลดให้เข้ากับเค้าโครงของแอป ปรับปรุงประสบการณ์ผู้ใช้ด้วยข้อความในแอปที่ดูเหมือนเป็นองค์ประกอบดั้งเดิมของแอป

การนำไปใช้

Anchor link to

ขั้นแรก รับอินสแตนซ์ของคลาส RichMediaStyle:

PWRichMediaStyle *style = [PWRichMediaManager sharedManager].richMediaStyle;
RichMediaStyle style = RichMediaManager.getRichMediaStyle();

สีพื้นหลัง

Anchor link to

ทำให้ข้อความในแอปดูเป็นส่วนหนึ่งของแอปของคุณโดย การเปลี่ยนสีพื้นหลัง ของหน้าริชมีเดียที่แสดงต่อผู้ใช้แอป

style.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.2f];
style.setBackgroundColor(ContextCompat.getColor(getApplication(),R.color.balck));

เพียงเท่านี้!

แอนิเมชัน

Anchor link to

เพิ่มประสิทธิภาพของข้อความในแอปของคุณโดย การสร้างแอนิเมชันการปรากฏของริชมีเดีย

ตั้งค่า animation delegate เป็นหนึ่งในคลาสเริ่มต้น:

  • PWRichMediaStyleSlideLeftAnimation,
  • PWRichMediaStyleSlideRightAnimation,
  • PWRichMediaStyleSlideTopAnimation,
  • PWRichMediaStyleSlideBottomAnimation,
  • PWRichMediaStyleCrossFadeAnimation.
style.animationDelegate = [PWRichMediaStyleCrossFadeAnimation new];

ตั้งค่า animation delegate เป็นหนึ่งในคลาสเริ่มต้น:

  • RichMediaAnimationSlideTop,
  • RichMediaAnimationSlideBottom,
  • RichMediaAnimationSlideRight,
  • RichMediaAnimationSlideLeft,
  • RichMediaAnimationCrossFade.
richMediaStyle.setRichMediaAnimationType(new RichMediaAnimationSlideTop());

หากต้องการตั้งค่า แอนิเมชันที่กำหนดเอง ให้ implement เมธอด PWRichMediaStyleAnimationDelegate สำหรับ iOS หรือ RichMediaAnimation สำหรับ Android ดังนี้:

1. ตั้งค่า animation delegate:

style.animationDelegate = self;

2. Implement เมธอด PWRichMediaStyleAnimationDelegate (อย่าลืมเรียกใช้ completion block):

- (void)runPresentingAnimationWithContentView:(UIView *)contentView parentView:(UIView *)parentView completion:(dispatch_block_t)completion {
contentView.transform = CGAffineTransformMakeTranslation(0, parentView.bounds.size.height);
[UIView animateWithDuration:0.6
delay:0
usingSpringWithDamping:0.4
initialSpringVelocity:0
options:0
animations:^{
contentView.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
completion();
}];
}
- (void)runDismissingAnimationWithContentView:(UIView *)contentView parentView:(UIView *)parentView completion:(dispatch_block_t)completion {
[UIView animateWithDuration:0.3
animations:^{
contentView.alpha = 0.0f;
contentView.transform = CGAffineTransformMakeScale(2, 2);
} completion:^(BOOL finished) {
completion();
}];
}

Implement อินเทอร์เฟซ RichMediaAnimation และตั้งค่าสำหรับแอนิเมชันการเปิดและปิดริชมีเดียที่กำหนดเอง:

richMediaStyle.setRichMediaAnimation(new RichMediaAnimation() {
//Allows to set rules and behavior for custom Rich Media open animation
@Override
public void openAnimation(View contentView, View parentView) {
AnimationSet fadeInAnimation = new AnimationSet(true);
fadeInAnimation.addAnimation(new TranslateAnimation(0.15f * parentView.getWidth(), 0, parentView.getHeight() / 2.5f, 0));
fadeInAnimation.addAnimation(new AlphaAnimation(0, 1));
fadeInAnimation.addAnimation(new ScaleAnimation(0.7f, 1.0f, 0.7f, 1.0f));
fadeInAnimation.setDuration(2000);
fadeInAnimation.setInterpolator(new DecelerateInterpolator(1f));
contentView.startAnimation(fadeInAnimation);
}
//Allows to set rules and behavior for custom Rich Media close animation
@Override
public void closeAnimation(View contentView, View parentView, Animation.AnimationListener endAnimationListener) {
// !IMPORTANT!
// endAnimationListener has to be added to your custom animation to let Pushwoosh SDK handle animation end event
AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
alphaAnimation.setDuration(2000);
alphaAnimation.setAnimationListener(endAnimationListener);
alphaAnimation.setFillEnabled(true);
alphaAnimation.setFillAfter(true);
contentView.animate().translationY(parentView.getHeight() / 5).setDuration(250).start();
parentView.startAnimation(alphaAnimation);
}
});

มุมมองการโหลดที่กำหนดเอง

Anchor link to

ดึงดูดความสนใจของผู้ใช้ตั้งแต่วินาทีแรกด้วย มุมมองการโหลดที่กำหนดเอง ของข้อความในแอปของคุณ

1) ใช้ loadingViewBlock ดังนี้:

style.loadingViewBlock = ^PWLoadingView *{
return [[[NSBundle mainBundle] loadNibNamed:@"LoadingView" owner:self options:nil] lastObject];
};

2) “LoadingView” ในที่นี้ต้องสืบทอดมาจาก PWLoadingView (กำหนดไว้ใน PWRichMediaStyle.h):

3) ตั้งค่า outlets:

RichMediaStyle.LoadingViewCreatorInterface implement เมธอดที่ส่งคืน View ที่จะใช้เป็นหน้าจอโหลดสำหรับริชมีเดีย:

richMediaStyle.setLoadingViewCreator(() -> {
View screenView = createYourScreenView();
return screenView;
});

การหน่วงเวลาเปิดใช้งานปุ่มปิด

Anchor link to

ตรวจสอบให้แน่ใจว่าผู้ใช้เห็นข้อความในแอปโดย การปิดใช้งานปุ่มปิด จนกว่าริชมีเดียจะโหลดเสร็จ

style.closeButtonPresentingDelay = 3;
// set a value in milliseconds
richMediaStyle.setTimeOutBackButtonEnable(3000);