Sliding effect-fixed title in ListView sliding & Title scaling effect, sliding listview
Please specify the source for reprinting. Thank you ~~
Overview
Today, it is a simple result. Many applications use this effect. In fact, the implementation idea is quite simple. That is, when a Listview is sliding, its head has a slide-up and can be fixed, and the slide can move with the listview header, or the size of the slider is scaled. The implementation in this article is relatively simple, but the same is true for many complicated implementation ideas. Similar to the trendy one, pulltozoomlistview also calculates a scaling scale Based on sliding, let's take a look.
This is the effect of moving a fixed set of titles up:
This is based on the sliding scaling effect:
First, let's look at the effect of fixed titles.
The image and test entries here are the two headers of listview:
View view = LayoutInflater.from(this).inflate(R.layout.lv_test, null);View view2 = LayoutInflater.from(this).inflate(R.layout.item, null);lv_test.addHeaderView(view);lv_test.addHeaderView(view2);
Then this activity implements OnScrollListener. In the rewrite method, we obtain the top of the second test head:
@Overridepublic void onScrollStateChanged(AbsListView view, int scrollState) {}@SuppressLint("NewApi")@Overridepublic void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) { int top2 = ll_tt.getTop(); if (top2 <= 0 || firstVisibleItem >= 1 ) { tv_shadow.setVisibility(View.VISIBLE); }else { tv_shadow.setVisibility(View.INVISIBLE); }}
Based on the top value of this head and the position of the first display, we control whether the hidden head in RelativeLayout is displayed. In this way, the effect of this fixed title is easily realized. Note that the getTop method here is to obtain the top of the current control relative to its parent control. If you have a LinearLayout level outside TextView, You need to obtain the getTop of this LinearLayout, otherwise, getTop of TextView is always a value.
Next, let's look at the effect of Scaling with your fingers.First, we need to know a original scale. The value of this scale * getTop () should be 1, and when getTop () is 0, their product is also 0, this enables a scale from 0 to 1, and when getTop () is smaller than 0, we do not need to continue scaling (or do other effects as needed ).
First, let's take a look at how to obtain the initial scale:
@SuppressLint("NewApi")@Overrideprotected void onResume() { super.onResume(); ViewTreeObserver vto = ll_tt.getViewTreeObserver(); vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() { @Override public void onGlobalLayout() { ll_tt.getViewTreeObserver().removeOnGlobalLayoutListener(this); top = ll_tt.getTop(); scale = (float) scale / (float) top; System.out.println("scale : " + scale); } });}
This should be very familiar, but it is rarely used. Right, you can use this method to obtain certain properties of the control when the interface is not finished. Here we get the value of getTop in the onResume method, and then divide it by 1 (the initial value of scale is set to 1), that is, the initial value of scale, in this way, the initial value * getTop is 1, that is, it is not scaled at the beginning, and then scaled with the finger moving. Note that scale must be defined as float. Otherwise, the result is only 0.
Then let's look at our settings in the sliding listener:
@SuppressLint("NewApi")@Overridepublic void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) { int top2 = ll_tt.getTop(); if (top2 >= 0) { tv.setScaleX(top2 * scale); tv.setScaleY(top2 * scale); }}
Here we need to get the top value as the finger slides continuously, and then let TV scale according to the top * scale value. In this way, a view scaled as the finger moves is successfully completed.
Demo