软键盘 -仿 QQ/微信 聊天界面布局
导读
在 Android 开发中，软键盘的弹出通常会将部分布局顶出屏幕外，或者直接覆盖在屏幕上的效果，或让人觉得很突兀，或无法时时刻刻看到底部输入框的内容；这往往导致用户体验不佳。为了解决这个问题，我们需要设计一种能够像 QQ/微信 这样的人性化布局。
软键盘弹出前的准备工作
在开始设计之前，我们需要了解软键盘弹出的原理和特点。软键盘的弹出通常会将部分布局顶出屏幕外，或者直接覆盖在屏幕上的效果。这意味着我们需要预先考虑如何处理这些布局，以确保用户体验良好。
布局设计
为了实现像 QQ/微信 这样的布局，我们需要进行以下设计：
1. 底部输入框的固定位置：首先，我们需要将底部输入框固定在屏幕的底部，这样即使软键盘弹出，也不会覆盖输入框。
2. 上下滑动布局：其次，我们需要设计一个能够上下滑动的布局，以便用户可以看到整个界面。我们可以使用 ScrollView 或 RecyclerView 来实现这个功能。
3. 软键盘弹出的处理：当软键盘弹出时，我们需要处理好布局的显示和隐藏。我们可以使用 onWindowFocusChanged() 方法来检测软键盘的弹出状态，并根据此状态进行相应的布局调整。
布局代码示例
以下是布局代码示例：
```xml
android:layout_height="match_parent"> android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1"> android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal">
```
```javapublic class MainActivity extends AppCompatActivity {
private ScrollView scrollView;
private LinearLayout inputLayout;
@Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
scrollView = findViewById(R.id.scrollView);
inputLayout = findViewById(R.id.inputLayout);
// 处理软键盘弹出的事件 getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
}
@Override public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
if (hasFocus) {
// 当窗口获得焦点时，处理软键盘弹出的事件 handleSoftInput();
}
}
private void handleSoftInput() {
// 处理软键盘弹出的事件 int softInputHeight = getSoftInputHeight();
if (softInputHeight >0) {
// 当软键盘弹出时，调整布局的显示和隐藏 adjustLayout(softInputHeight);
}
}
private int getSoftInputHeight() {
// 获取软键盘的高度 return getWindowManager().getDefaultDisplay().getHeight();
}
private void adjustLayout(int softInputHeight) {
// 调整布局的显示和隐藏 if (softInputHeight >0) {
scrollView.setVisibility(View.GONE);
inputLayout.setVisibility(View.VISIBLE);
} else {
scrollView.setVisibility(View.VISIBLE);
inputLayout.setVisibility(View.GONE);
}
}
}
```
总结
通过以上设计和代码示例，我们可以实现像 QQ/微信 这样的布局，能够在软键盘弹出时调整布局的显示和隐藏，从而提供更好的用户体验。
聊天键盘android软键盘SoftInputqq微信聊天顶布局
