Android custom control case summary 2 (custom switch, pull-down refresh, sideslip menu)

Case 4: Custom switch:

Function introduction: the function of this case is to create a user-defined switch, and you can decide the background of the switch by yourself. When sliding the switch, the slider of the switch can follow the finger. When the finger is released, the slider slides to the rightmost or leftmost according to the state of the switch, saves the state of the switch and recalls the state of the switch to the caller. Of course, the switch control given by the above function system can also be implemented.

Implementation steps:

1. Write a class to inherit view and override the construction method of two parameters. Specify the workspace in the construction method, and connect the attribute value in Java code with the attribute value in XML through the attrs.getattributeresourcevalue method. This allows you to specify the relevant attribute values in the XML file. Rewrite onmeasure and OnDraw methods to draw pictures. Here, measure the size of the picture, and directly use the setmeasureddimension method to obtain the size of the picture itself. 2. Set interface callback. For the picture, we want to get the status of the switch at the caller, so we need to set an interface callback to monitor the status of the switch and call it when the status of the switch changes. The advantage of interface callback is that the caller does not know when to call, so set an interface in another file and trigger events in that file. Because the method of the interface is rewritten, the rewritten method is executed. In this way, the data callback can be realized. Interface callback is widely used in custom controls. Almost all controls need to set listening, and the writing method is relatively fixed. 3. Override the ontouchevent () method. The analysis shows that the switch is composed of two parts, one is the base and the other is the scribing. When the finger slides, the scribe should follow the finger. When the left side of the scribe is less than the left coordinate of the base, align the left coordinate of the scribe with the base. When the right side of the scribe is greater than the right coordinate of the base, align the right coordinate of the scribe with the base, so as to ensure that the scribe does not cross the boundary. When the finger is released, judge whether the center line coordinate of the scribe is on the left or right of the center line coordinate of the base, so as to determine whether the scribe finally stops on the left or right. At the same time, change the state of the switch, call back the state of the switch to the call of the control, and read the state of the switch.

Code implementation. Code in main program (caller):

Specific implementation of user-defined switch;

Preparation of layout file:

In order to make the attributes in the layout file work, write an attrs.xml file separately in the values folder to declare the relevant attributes.

Case 5: drop down refreshed listview:

Function introduction: the listview of the system itself does not have more functions of pull-down refresh and pull-up load by default. However, listview has addheadview and addfootview methods, so you can add header layout or foot layout for listview. For the head layout, there are three states: pull-down refresh, release refresh and refreshing, accompanied by corresponding animation prompts. After the refresh is successful, add a set of information for listview. After the same foot layout is loaded successfully, a message will be loaded after the last data in the listview.

Implementation steps:

1. Write layout file. In addition to a listview in the main interface, you also need a header layout file and a tail layout file. In the initial state, the head layout and foot layout are hidden. When the sliding event starts, adjust the position of the head layout and foot layout. here. The root tab of head layout and foot layout should be wrapped with LinearLayout, otherwise it is prone to problems in sliding display. 2. Write a class to inherit listview. Initialize the interface layout, and actively trigger the measurement through the view. Measure (0,0) method. Onmeasure will be called internally to obtain the height of the end layout. As mentioned in step 1, the header layout is hidden in the start state, so set the panding value for the header layout to hide the header layout. Only set the second parameter in setpadding to the height of the negative header file. Similarly, the display header layout only needs to set the second parameter in setpadding to 0. The above method is also used for displaying and hiding the root layout. Of course, you can also change the fourth parameter of setpadding to control display and hiding. 3. Override the ontouchevent() method. When the finger is pressed, record the initial position. A Y coordinate is recorded when the finger slides. Judge the sliding direction of the finger through the difference between the two coordinates. When the position of the first visible item is 0, if the finger slides down, there are two states: one is pull-down refresh, which means that the head layout is never visible to just all visible; the other is release refresh. After all the head layouts are visible, continue to drag down to enter the release refresh state. Another state is refreshing. In this state, the header layout just stays at the top for a period of time. In actual development, refreshing is to request the network from the server. False data is added here. The transition between different states is also accompanied by animation effects. Therefore, there is also a gap animation to achieve up and down effects. 4. Write a sliding listening event, and write the foot layout logic in the listening event. When the following three conditions are met, the foot layout will be displayed. One listview is idle, the other is the last item visible on the interface, which is the last item in the listview, and the other is loading more things if it is not done at present. When displaying the foot layout, you should not only set the padding value, but also select the last item of listview, so that it can be displayed completely on the interface. 5. Finally, it should be noted that the status should be modified whether it is the same layout or foot layout. Therefore, you can add a callback listener. Indicates that the data refresh or loading is completed, and the head layout and foot layout can be hidden. At the same time, the status of the head layout is restored to drop-down refresh, and the foot layout is not loading. At the same time, stop the relevant animation and modify the displayed state.

Preparation of main program (caller). Generally, refresh is to request database data. The simulation data demonstration effect is directly given here.

The drop-down refreshes the logical part of the listview

The layout file consists of three parts, the main part of listview:

Header layout:

Foot layout:

Case 6 sideslip menu:

Function analysis: most of the previous cases have only one control, so they are implemented by inheriting view. The sideslip menu obviously requires two controls to implement, one for loading the main interface and the other for loading the sideslip interface. Therefore, you need to inherit ViewGroup. Control the display and hiding of the interface by sliding in the main interface.

Implementation steps:

1. Writing of layout documents. The layout file consists of two parts, the main interface and the sideslip interface. There is a title bar in the main interface, which is composed of picture buttons and text. You can also control the display and hiding of the sidebar by clicking on the image. Sidebar add a linear layout in the Scrollview, and arrange the text view vertically in the linear layout to display the text. Of course, the sideslip menu can also be displayed with listview. For simplicity, listview is not used here. In addition, to respond to click events, textview needs to set clickable to true. 2. Create a class that inherits from ViewGroup. Override the onmeasure () method to measure the size of the control, including two child controls. Here, the width of the sideslip menu is written in the layout file, and the width of the main interface is adapted to the mobile phone interface. Therefore, you can call the menu. Measure (menuwidth, heightmeasurespec) and main. Measure (widthmeasurespec, heightmeasurespec) methods respectively to obtain. Child views in the typesetting container. Since the custom control contains more than one child view, it is essential to override the onlayout () method. Layout the sub view. The 0,0 coordinate of the sub view is the upper left corner of the slidingmenu. Layout the sideslip menu. The left coordinate of the menu is at the negative menu width position, the top coordinate of the menu is at the position of 0, the right coordinate of the menu is at the position of 0, and the bottom coordinate of the menu is at the bottom of the container. Layout the main interface. The left coordinate of the main interface is at 0, the top coordinate of the main interface is at 0, the right coordinate of the main interface is at the right of the container, and the bottom coordinate of the main interface is at the bottom of the container. 3. Rewrite onintercepttouchevent. In this case, only horizontal movement is concerned. Therefore, if the horizontal movement distance is greater than the vertical movement distance, it is considered to be horizontal movement. The event is intercepted and not used by Scrollview. This event is handled by the control itself. It is necessary to introduce event distribution. The view collection handles the distribution of events from top to bottom. ViewGroup has the following three touch related methods. Dispatchtouchevent (motionevent EV) is used to issue touch events, onintercepttouchevent (motionevent EV) is used to intercept touch events, and ontouchevent (motionevent) is used to process touch events. Here, onintercepttouchevent () is overridden, and the ontouchevent () method is overridden accordingly. 4. Implement the logic of sliding following in ontouchevent() method. In sliding events, only lateral sliding is concerned. When pressed, record the current X coordinate. When sliding, record the current X coordinate again and subtract them to get the moving distance. Slide to the corresponding position through the scrollto() method. The scrollto() method given by the system defaults to a negative value, so you can override the scrollto() method to ensure that the movement is positive. Code optimization. In fact, the above process can realize the function of sideslip menu. When the sliding process is slightly stiff. At this time, you can use scroller, which is specially used to simulate the value of scrolling. It should also be used in conjunction with the computescroll () method. 5. There is also a menu switch button, either on or off. When on, the sideslip menu is fully displayed. When off, hide the sideslip menu. This logic is the same as the finger raising logic in ontouchevent().

Preparation of main program (caller):

The main logic of the sideslip menu.

Overall layout

Main interface layout

Sideslip interface layout

The above is the whole content of this article. I hope it will be helpful to your study, and I hope you can support programming tips.