Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

Android input method popover elegant handling

Recently, I found a bug that whenever the input method is popped up in a certain interface of the project, the background always moves up along with the input method, causing the background to be compressed. Although it is not important, it is extremely unpleasant after finding this bug.

Other people’s products

I picked up a cell phone for example

  • The search box should be at the top so that even if the input method pops up, it won’t block it

  • A similar input box is at the bottom. The input box moves up with the input method while the background does not move

  • Wechat chat interface, the background does not move, input box and chat records with the input method to move up

These three cases basically cover most scenarios involving input fields, so let’s look at how to implement them.

implementation

I’m going to skip the code at the top of the input box.

Nuggets input box popup window implementation

It’s easy to see how complex the nuggets popover is and how you can insert pictures and emoticons. And after the popup window, the original article can not slide.

The popover for the nuggets comment is a Dialog and a Dialog-themed Activity

So let’s verify that.

The modal window Activity called TransparentCommentActivityNew right? The Activity for article details is called DetailActivity, right?

@Nuggets Android developer

This is very simple, when the emergence of a new Activity, there is no need to consider the original Activity background compression, layout adaptation problems. Because everything is in a new Activity and you can’t operate the following Activity.

Conclusion: Creating a popover theme Activity can be a simple and convenient solution to the layout confusion caused by input method.

WeChat chat background will not be compressed

I’ve had a problem for a long time. This is the normal layout where the background is compressed by the input method. Look at the code:

<? The XML version = "1.0" encoding = "utf-8"? > <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@mipmap/test"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:orientation="horizontal"> <EditText android:layout_width="0dp" android:layout_height="wrap_content" Android :layout_weight="1" Android :hint=" Please enter... <Button Android :layout_width="wrap_content" Android :layout_height="wrap_content" Android :text=" submit "/> </LinearLayout>  </RelativeLayout>Copy the code

Rendering (the moon can be seen compressed) :

The solution

Methods a

  1. The Activity configuration in the Androidmanifest.xml file:

android:windowSoftInputMode=”adjustResize|stateHidden”

  1. Set the background in the onCreate method instead of the background in XML:

getWindow().setBackgroundDrawableResource(R.mipmap.test);

Method 2

  1. The Activity configuration in the Androidmanifest.xml file:

android:windowSoftInputMode=”adjustResize|stateHidden” 2. Layout files set custom backgrounds

   <com.myapplication.MyBackground
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@mipmap/test" />
Copy the code
public class MyBackground extends RelativeLayout { private Context mContext; public MyBackground(Context context) { super(context); mContext = context; } public MyBackground(Context context, AttributeSet attrs) { super(context, attrs); mContext = context; } public MyBackground(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); mContext = context; } public MyBackground(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) { super(context, attrs, defStyleAttr, defStyleRes); mContext = context; } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { DisplayMetrics dm = new DisplayMetrics(); WindowManager mWm = (WindowManager) mContext.getSystemService(Context.WINDOW_SERVICE); mWm.getDefaultDisplay().getMetrics(dm); int screenHeight = dm.heightPixels; heightMeasureSpec = MeasureSpec.makeMeasureSpec(screenHeight, MeasureSpec.EXACTLY); super.onMeasure(widthMeasureSpec, heightMeasureSpec); }}Copy the code

Methods three

  1. The Activity configuration in the Androidmanifest.xml file:

android:windowSoftInputMode=”adjustNothing|stateHidden”

  1. Dynamically calculate the height of the input box, add a View with the same height below the EditText when the input method popup, and disappear when the input method disappears.