Android Imitation micro-letter list Sliding Delete control (i) _android

Source: Internet
Author: User
Tags call back

This time the list slides to remove the third wave, The Imitation micro-letter list Slides Delete. First Effect chart:

The previous article inside said open source framework Swipelistview is the implementation of the principle of each list item contains up and down two view, the general state of the upper view covered with the lower view, when the user slid open the view of the upper level, the lower view shows out. But looking closely at the item on the micro-letter list, obviously not the implementation, the micro-letter item should be a single view, except that the item is beyond the width of the ListView, and when the user slides the item, the item's view over the screen is displayed on the screen. This sliding implementation is also very good.

Since the realization of the principle of micro-letter, now need to find a specific implementation of the scheme, I began to think of the relatively simple, thought to write a horizontal linear layout linearlayout, so that it contains two sub layout, the left side of the child layout width is set to fill the width of the parent layout, Assuming that another child layout will automatically exceed the display range of the parent layout, however, when the specific test, found that even if the left side of the child layout set to fill the width of the parent layout, but the actual display is still two child layout is included in the parent layout display scope, the right child layout does not exceed the parent layout display range.

Tangled up for a while, occasionally remembered ScrollView there is another type of Horizontalscrollview, and this android provides Horizontalscrollview can do its child view beyond its display range, So I can use Horizontalscrollview directly to implement this item, I decided to customize a control, inherit from Horizontalscrollview, add two sub layouts directly inside the code, and let the left layout width fill the control's own width. So that the right side of the layout beyond the display of control, but very strong, Horizontalscrollview more proud, difficult to control, exotic bugs are emerging, such as the left side of the child layout rendering out, but the right of the child layout Leng did not initialize, not to mention the slide, get the burn, Finally, there is no way, have to put down temporarily.

Finally, it comes to the idea of using a custom ViewGroup to implement this item. Now many apps in the first time, there will be an introductory navigation interface, Users page by page of the slide, after reading the introduction of navigation and then officially into the app, now this kind of navigation introduction should be most of the use of Viewpager to achieve, Viewpager can do two sliding pages at the same time display in the screen range, has a good experience. But Viewpager was introduced in the SUPPORT.V4, not at first, and what was the first approach to this navigation introduced? Of course is the custom of the viewgroup, in fact, Supprot.v4.ViewPager itself is a custom viewgroup. About the use of custom ViewGroup implementation of the introduction of the navigation, csdn on a Daniel has written a special article introduced, here will not be said in detail.

This article is about how to use a custom ViewGroup to implement the item's child view beyond the parent layout's display range.

Write a swipeitemview, inherit from the ViewGroup, construct the method inside, pass in the reference ID of the left layout and the reference ID of the right layout, initialize the left and right child layout, and add them to the Swipeitemview as the child view, the code is as follows:

 private void init (context context, AttributeSet attrs) {Mscroller = new Scroller (CO

    ntext); ... if (Mprimaryviewid = 1) throw new RuntimeException ("illegal attribute ' Primaryview ', make Su

    Re you have set it ");
    Mprimaryview = Layoutinflater.from (GetContext ()). Inflate (Mprimaryviewid, NULL);
    Mprimaryview.setclickable (FALSE);
    AddView (Mprimaryview, 0); if (Mslidingviewid!=-1) {Mslidingview = Layoutinflater.from (GetContext ()). Inflate (Mslidingviewid, NULL)
      ;
      Mslidingview.setclickable (FALSE);
    AddView (Mslidingview, 1); }
  }  

The

Then needs to override the ViewGroup Onmeasure () method to measure the width of the swipeitemview and its child view, which first gets the heightsize contained in the transferred Heightmeasurespec, When the value of the heightsize is the same as the Heightmeasurespec, the width of the whole swipeitemview is measured, which is when we do not do extra processing, when the heightsize is not equal to the incoming Heightmeasurespec, is used to measure the width of the swipeitemview it contains, and here we do the extra processing, mainly for the right mslidingview that goes beyond the Swipeitemview display range, and I want it to be wide just to wrap its contents on the line, Do not want its width and width of the screen, so the construction of such a parameter Measurespec.makemeasurespec (0, measurespec.unspecified), the specific code is as follows:

 @Override protected void onmeasure (int widthmeasurespec, int heightmeasurespec) {Super.on

    Measure (Widthmeasurespec, Heightmeasurespec);
    int heightsize = measurespec.getsize (Heightmeasurespec);
    int widthsize = measurespec.getsize (Widthmeasurespec);
    int heightmode = Measurespec.getmode (Heightmeasurespec);

    int widthmode = Measurespec.getmode (Widthmeasurespec);
          if (heightsize!= heightmeasurespec) {mprimaryview.measure (Measurespec.makemeasurespec, WidthSize),

      Measurespec.makemeasurespec (Heightsize, Heightmode));
            if (Mslidingview!= null) {mslidingview.measure (Measurespec.makemeasurespec (0, measurespec.unspecified),
      Measurespec.makemeasurespec (Heightsize, Heightmode));
      } else {mprimaryview.measure (widthmeasurespec, Heightmeasurespec);
    if (Mslidingview!= null) mslidingview.measure (Widthmeasurespec, Heightmeasurespec); }
  } 

Then rewrite the ViewGroup onlayout () method to place the child view in the Swipeitemview location, mainly to the right side of the Mslidingview arranged on the left side of the Mprimaryview, the specific code is as follows:

@Override
  protected void OnLayout (Boolean changed, int l, int t, int r, int b) {
    mprimaryview.layout (L, T, R, b); C3/>if (Mslidingview!= null)
      mslidingview.layout (R, T, R + mslidingview.getmeasuredwidth (), b);
    

OK, the specific Swipeitemview initialization is complete, what next need to do, look at the above construction method, there is no see Mscroller = new Scroller (context) This line of code, We need to use this mscroller to do this Swipeitemview slide animation effect. We know that the Scrollby () and Scrollto () Two methods are available in ViewGroup to move this viewgroup view content, where Scrollby () moves the distance specified by the parameter, and the Scrollto () method moves to the location specified by the parameter. But Scrollby () is good, if every time is to move a small distance, the feeling of the user is a continuous animation effect, but Scrollto () is instantaneous movement, the middle without any animation effect, will make people feel very abrupt, So we need to use the object of Mscroller.

Scroller is what Android offers to achieve the moving animations we need. Scroller itself is not going to perform a moving animation, it feels scroller more as a conductor, and when we call its Scroller.startscroll () method, we need to pass in the initial position of the move, the distance to move, and the time spent, Simply understood, we assume that the specified time is 10s, that 3s, the ViewGroup view content should be moved to where, the first 7s, should be moved to where, and this moment scroller calculated position can pass Scroller.getcurrx () and Scroller.getcurry () gets, this process, scroller will call back the Computescroll () method in ViewGroup, in which we invoke Scrollto () to perform a specific move operation. The Scrolltowithanimation () method We implement is to provide a way for the subsequent swipelistview to move an item and animate the process. The code is as follows:

 @Override public
  void Computescroll () {
    if (Mscroller.computescrolloffset ()) {
      Scrollto ( Mscroller.getcurrx (), Mscroller.getcurry ());
    }

  /**
   * Just like Scrollto (), but with animation:D
   * * */public
  void scrolltowithanimation (int scrollx, int scro lly) {
    mscroller.abortanimation ();
    Mscroller.startscroll (Getscrollx (), getscrolly (),
        scrollx-getscrollx (), getscrolly ()-scrolly, c);
  

Next you need to implement a custom ListView, which is named Swipelistview. The next article continues.

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.