Shulou(Shulou.com)05/31 Report--

This article mainly introduces "how Android realizes the function of automatically locating comments to relevant lines in imitating Wechat moments". In daily operation, I believe that many people have doubts about how Android can automatically locate comments to relevant lines in moments like Wechat. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the question "how can Android achieve the function of automatically locating comments to relevant lines in imitating Wechat moments?" Next, please follow the editor to study!

Open your Wechat moments, click on the comment, and you will find a small detail: the height of the text input box is located exactly at the bottom of the message.

This is actually very simple to achieve, let's take a look at it.

The simplest RecyclerView

It is still the first to implement RecyclerView. Like moments, we also add the head, so that when we click on the first message, the effect will be better.

The content of the message is simple. Anyway, let's just see the effect.

The head is also very simple, with a picture as a distinction.

The message content takes string as the information data type, and the header data type is TopClass.

Data class TopClass (val value: String)

Implement an adapter

Class MainAdapter (privateval beans: ArrayList, val context: Context): RecyclerView.Adapter () {var height = 0 enum class TYPE (val value: Int) {TOP (0), NORMAL (1)} override fun onCreateViewHolder (parent: ViewGroup?, viewType: Int): RecyclerView.ViewHolder {when (viewType) {TYPE.NORMAL.value-> {val view = LayoutInflater.from (context) .innovate (R.layout.adapter_main, parent) False) return MainNormalViewHolder (view)} TYPE.TOP.value-> {val view = LayoutInflater.from (context) .propagate (R.layout.adapter_top, parent, false) return MainTopViewHolder (view)}} throw Exception ()} override fun getItemCount () = beans.size override fun onBindViewHolder (holder: RecyclerView.ViewHolder? Position: Int) {if (holder! = null) {when (getItemViewType (position)) {TYPE.NORMAL.value-> {(holder as MainNormalViewHolder) .setText (beans [position] as String) holder.clickComment (holder.layoutPosition)} TYPE.TOP.value-> {} override fun getItemViewType (position: Int): Int {when (Beans [position] ]) {is String-> return TYPE.NORMAL.value is TopClass-> return TYPE.TOP.value} return super.getItemViewType (position)} inner class MainNormalViewHolder (itemView: View): RecyclerView.ViewHolder (itemView) {fun setText (text: String) {itemView.tv_title.text = text} fun clickComment (position: Int) {itemView.tv_comment.setOnClickListener {(context as MainActivity). ShowInputComment (itemView.tv_comment Position)}} inner class MainTopViewHolder (itemView: View): RecyclerView.ViewHolder (itemView)}

Such a list is complete.

Generation of input box

There is a key point here, how to float EditText on the keyboard, and RecyclerView will not be squeezed on. Here we can use Dialog, and at the same time use ScrollView to occupy places in the layout.

Only with the cooperation of ScrollView can we achieve our effect.

Let's see the effect.

Scrolling of the list

The input box is also available, so all you need to do is scroll. We can use smoothScrollBy to make RecyclerView scroll on the X or Y axis. So how far should we roll here? Well, let's do the math.

The red part in the picture shows the location of an information comment area before the keyboard is displayed; the blue part is the keyboard, and when the keyboard is turned on, we need to move the red part to the yellow position. So the height of the area between the yellow top and the red top is the number that RecyclerView needs to scroll, so it's easy. We use getLocationOnScreen to get the difference, plus the height of the comment area.

Fun showInputComment (commentView: View, position: Int) {/ / RV position of the starting Y of the comment section val rvInputY = getY (commentView) val rvInputHeight = commentView.height dialog = Dialog (this Android.R.style.Theme_Translucent_NoTitleBar) dialogroom.setContentView (R.layout.dialog_comment) dialogroom.show () val handler = object: Handler () {} handler.postDelayed (the location of input box Y in the {/ / dialog box val dialogY = getY (dialogroom.findViewById (R.id.dialog_layout_comment)) rv_main.smoothScrollBy (0, rvInputY-(dialogY-rvInputHeight))} Private fun getY (view: View): Int {val rect = IntArray (2) view.getLocationOnScreen (rect) return rect [1]}

Let's see the effect.

But there are a few minor problems. If you click on the last line, you will not be able to achieve the same effect because there is not enough scrolling space, and when you press the return key, the keyboard disappears first, and then press again before Dialog disappears.

For the first problem, we can directly add an empty View as the last item in the list, and the height should be equal to the height of the input box; the second problem is also very simple, that is, to listen for changes in View height when the keyboard is popped up and hidden.

Data class BottomClass (val value: String)

Add when you click

Handler.postDelayed (position of input box Y in the {/ / dialog box val dialogY = getY (dialogroom.findViewById (R.id.dialog_layout_comment)) if (position = = arrays.size-1) {arrays.add (BottomClass (")) adapter?.height = dialogroomroom.findViewById (R.id.dialog_layout_comment). Height adapter?.notifyDataSetChanged ()} rv_main.smoothScrollBy (0, rvInputY-(dialogY-rvInputHeight))}, 300)

Delete this object when you close Dialog

Window.decorView.viewTreeObserver.addOnGlobalLayoutListener {val rect = Rect () window.decorView.getWindowVisibleDisplayFrame (rect) val displayHeight = rect.bottom-rect.top val height = window.decorView.height val keyboardHeight = height-displayHeight if (previousKeyboardHeight! = keyboardHeight) {val hide = displayHeight.toDouble () / height > 0.8 if (hide) {if (arrays [arrays.size-1] is BottomClass) {arrays.removeAt (arrays.size-1) adapter? .notifyDataSetChanged ()} dialog?.dismiss ()}

Let's see the final effect.

This is the end of the study on "how to achieve the function of Android imitating Wechat moments to automatically locate comments to relevant lines". I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.