Mobile Platform as a Service:Customize startup loading page

Procedure

1. Right click res, select layout > New > XML > Layout XML File.

2. Enter the layout name in Layout File Name, click Finish.

3. Define the loading layout in activity_loading_page.xml as follows:

   <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <com.alipay.mobile.antui.basic.AUTitleBar
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <RelativeLayout
        android:background="@android:color/white"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_centerInParent="true">
            <TextView
                android:id="@+id/tv_app"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
            <com.alipay.mobile.antui.basic.AUProgressBar
                android:id="@+id/progress"
                style="?android:attr/progressBarStyleSmall"
                android:layout_gravity="center"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
            <TextView
                android:id="@+id/tv_tips"
                android:visibility="gone"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        </LinearLayout>
    </RelativeLayout>
   </LinearLayout>

4. Create a TinyStartupLoadingView class that extends MPTinyBaseIntermediateLoadingView to initialize the interface and handle the back button event.

   public class TinyStartupLoadingView extends MPTinyBaseIntermediateLoadingView {
   
    private TextView tvAppName;
   
    private View progressBar;
   
    private TextView tvTips;
   
    public TinyStartupLoadingView(Context context) {
        super(context);
        init();
    }
   
    public TinyStartupLoadingView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }
   
    public TinyStartupLoadingView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }
   
    private void init() {
        LayoutInflater.from(getContext()).inflate(R.layout.activity_loading_page, this, true);
        tvAppName = (TextView) findViewById(R.id.tv_app);
        progressBar =  findViewById(R.id.progress);
        tvTips = (TextView) findViewById(R.id.tv_tips);
        ((AUTitleBar)findViewById(R.id.title)).getBackButton().setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Activity host = getLoadingActivity();
                if (host != null) {
                    host.finish();
                }
            }
        });
    }
   
    /**
     * Called upon initialization, the appid of the mini program will be passed in. Other information, such as name, icon, and version, may be empty.
     */
    @Override
    public void initView(AppInfo info) {
        tvAppName.setText(info.appName);
    }
   
    /**
     * Called when it fails to obtain the mini program
     */
    @Override
    public void onError() {
        tvTips.setText("fail");
        tvTips.setVisibility(VISIBLE);
        progressBar.setVisibility(GONE);
    }
   
    /**
     * Called when the mini program information is obtained, including appid, name, icon, and version.
     */
    @Override
    public void update(AppInfo info) {
        tvAppName.setText(info.appName);
    }
   }

5. Before starting the mini program, enable the custom configuration. Add the following code to the click event listener of MainActivity:

   MPTinyHelper.getInstance().setLoadingViewClass(TinyStartupLoadingView.class);

6. Click to run the application on a real device.

7. Click Hello World! to start the mini program. The custom loading page is displayed during startup.