View Getting Started

Source: Internet
Author: User

View Overview

For a view, he should have two positions: one is the display position (that is, where we see it), and one is the click location (that is, where the user clicks the event).

After the initialization is complete, the two locations are coincident, so "what you see is what you point to." However, when the Scrollto (), Scrollby () or tweens animation is called, the view is not coincident with the point: the location found changes, but the point is still in place. This is also the difference between a property animation and a tweens animation, the former still maintains what is seen as the point.

Position

Mleft, mtop, Mbottom and mright: Represents the x, y coordinates of the upper-left corner of the original , respectively, and the lower-right corner. They are all relative to the parent component . If the upper-left corner of the control is coincident with the upper-left corner of the parent control, then the Mleft,mtop is 0. The corresponding values can be obtained by GetLeft (), GetRight (), GetTop (), and Getbottom ().

X,y,translationx and Translationy. X, y represents the current upper-left coordinate of the view relative to its parent control, and Tranlationx and Translationy are the distances that the view moves on the x, Y axis. x = Mleft+translationx;y = Mtop + translationy.

when moving, Mleft,mright,mbottom and mtop are constant, changing only X,y,translationx and Translationy.

Mscrollx and mscrolly: represents the displacement of the display area moving altogether, which is independent of mleft and Translationx equivalents . The mscrolly represents the top coordinate of the hit area minus the top coordinates of the content area. Since Scrollto/scrollby two methods only change the content area, the Click Area does not change. So Scrollby (100,0) means that the left edge of the content area is 100 pixels less than the current left edge, so the image moves to the left (the user will always see the content area, not the click Area).

The coordinates of the view can be divided into three categories: the first type of mleft, such as four properties, the original coordinates of the view, once displayed, not modifiable, and the second, the original coordinates on the basis of the movement of the new coordinates, it does not affect the original coordinates, but can change the current position, the third class, the content area coordinates, That is, you cannot change the original coordinates or change the new coordinates, just modify the coordinates of the content area.

The difference between setleft () and Layoutparams.leftmargin

Both can change the value of the Mleft: that is, change the initial position of the child view in the parent view. However, Setleft () only modifies the value of mleft and does not affect the values of other properties Mright,mtop and Mbottom. and does not request that the parent component be re-measured, layout.

However, the latter modifies the values of four properties such as Mleft,mright and causes a re-measurement and layout.

for both, they can cause a change in the click Area, but the former does not affect the value of MSCROLLX and mscrolly, while the latter affects it. modification by Layoutparams is equivalent to regenerating the control, and Mscrollx and mscrolly are initialized to 0.

Move

There are three ways to move a view based on the three types of coordinates of the view.

First, change the content area. There are two ways of doing this:

1, through Scrollto ()/scrollby ()

2, through tweened animation. Its essence is also through Scrollto ()/scrollby ().

Second: Change the area of the click. There are two ways of doing this:

1, change the values of attributes such as Mleft,x,y,translationx and Translationy.

2, use property animations. In fact, the quality is still modified by the values of the four attributes above.

The third type: change the initial position. There is only one way:

Use Layoutparams, and modify several margin-related values such as Leftmargin,topmargin.

Comparison

The first method does not modify the click area, so if the view you want to move has a click event, it needs to be handled separately. The latter two are not required.

If you want to move the view in the parent view, you can't use Scrollto/scrollby in the first method, but you can use animations.

Layout

Layout (): Used to determine your own location. Set the values for Mleft,mright,mtop and mbottom by using the Setframe () method.

OnLayout (): Used to determine the location of the child view. The layout () method of the child view is called.

Draw

You generally do not need to rewrite the draw () method.

The main function of draw () is to control the entire drawing process, because even if the child view overrides the Draw () method, it must also call Super.draw (). The general process for draw is:

1, Draw background--drawbackground ()

2, draw your own content--ondraw ()

3, Draw sub View--dispatchdraw ()

4, draw some decorative content (foreground, scroll bar, etc.)--ondrawforeground ().

Common methods

GetTop (), GetLeft (), Getbottom () and GetRight () obtain the relative position of the view in the parent component. When the display position changes, the value is not affected. For example, the value of getscrolly () changes continuously while the scrollview is constantly sliding, but the value of GetTop () is fixed. In ScrollView, even if the view is not displayed yet, it has gettop (), which means its position has been placed in the ScrollView.

ScrollTo (), Scrollby (): Moves the view's display position and does not move its click position. Panning animations are also implemented using these two methods.

GETSCROLLX (), getscrolly (): Gets the total displacement of the view by Scrollby () or Scrollto () (This is the displacement, not the distance).

Settranslationx (): Sets the x-axis balance distance. The difference from Scrollto () is that it moves the view's click position and display position at the same time.

Onscrollchanged (): Callback The method after each call to Scrollto (). For example, when the ScrollView keeps sliding, the method is always recalled, whether the finger presses or the screen scrolls automatically. Its first two parameters refer to the current scroll displacement in both horizontal and vertical directions-the moving distance of the display position, and the last two parameters refer to the previous scroll displacement.

Overscrollby (): A callback in the scrolling process whose parameters are very useful (note: There is a problem with the callback for this method on the Meizu phone, there is a messy phenomenon). The first two parameters are: When this method is called, the movement distance of this scroll on the x, Y axis, the 34th parameter is: To call the method, the total scrolling distance on the x, Y axis, excluding the scrolling distance, the 56th parameter is: The distance can be scrolled on the x, Y axis, It can be understood as the height of its content minus the height of the control itself, and the 78th parameter is the amount of extra scrolling on the x, Y axis, which is the distance that can still be scrolled beyond the range. The last parameter is: The method is called because the touch Scrolls or scrolls automatically.

All of the above is ScrollView, and is not suitable for the ListView, because the ListView does not create all of the view when it is displayed . Of course, the meanings of onscrollchanged and Scrollby are the same for all view, because these methods are in the view class.

Dispatchdraw () and OnDraw (): Dispatchdraw () is primarily used for drawing of child view, while OnDraw () is used for its own drawing. Also, Dispatchdraw () is called after OnDraw ().

Computescroll (): Called by the parent view. When a child view has updated the MSCROLLX or mscrolly value, you can change the location of the child view in the method. This method is typically overridden when the view needs to be moved by gesture. It is called before OnDraw ().

Onattachedtowindow (): Called at some point before OnDraw (), but may also be called before Onmeasure (). Called when the view is attached to a window. Only after this method is available to draw the Surfaceview (all the images that are drawn on Android are onSurfaceview, except for their own use of Surfaceview ).

Ondetachedfromwindow (): In contrast to Onattachedtowindow (), called when the view falls off the window. The surfaceview used to draw after this method no longer exists.

Setwillnotdraw (): If this view does not need to draw anything, you can set the mark bit to true so that it can be optimized accordingly.

Scroll bar related properties

Scrollbarfadeduration: The duration of the animation when the scrollbar disappears. If you set this value very large, you can indirectly implement the effect of the scroll bar always effect.

Scrollbarthumbhorizontal, Scrollbarthumbvertical: Scrolls the picture in the scroll bar.

Scrollbartrackhorizontal, scrollbartrackvertical: Scroll track of the ScrollBar, which is the background of the scroll bar.

Fadescrollbars: Whether the scroll bar disappears. False, scrollbars persist; true, scrollbars fade out when not in use.

Scrollbarstyle: Used primarily to determine the position of the scroll bar . There are four values: Insideoverlay,insideinset and Outsideoverlay,outsideinset. outside is that the scrollbar is always at the boundary of the view, and inside means that the scrollbar is padding affected and moved in. Overlay says that the scrollbar covers the content area without increasing the value of the padding, while inset increases the padding value, which is equivalent to squeezing the content area further. Example:

    <listview        android:id= "@+id/listview1"        android:layout_width= "match_parent"        android:layout_height = "Wrap_content"        android:padding= "10px"        android:scrollbarstyle= "Insideoverlay" >    </listview >
scrollbarstyle= "Insideoverlay"


Scrollbarstyle= "Insideinset"

In contrast to the above two figure, it can be found that when overlay, the distance between the content area (that is, the red area) is 10px (padding is set to 10px in the ListView), and the content area is more than 10px when it is inset. However, the right-hand distance of the scrollbar border is 10px.

Scrollbarstyle= "Outsideoverlay"


Scrollbarstyle= "Outsideinset"

A comparison of four images reveals that the scrollbar is at the edge of the view while the scrollbar is outside by the padding, which is not necessarily on the edge of the inside.

Imageviewscaletype:

Reference: http://www.cnblogs.com/carmanloneliness/archive/2012/08/06/2625489.html

Center: The image size is the original size, if the picture size is larger than the ImageView control, the middle part of the picture is taken, and if it is smaller, the picture is centered directly.

Fitxy: The picture is scaled to the same size as the ImageView, and the picture's length-to-width scale is inconsistent. If the picture is larger than the ImageView, then the picture shrinks to the imageview size, and if the picture is smaller than the ImageView, the image expands to the entire imageview.

fitstart,fitcenter and fitend: Scales the length of the picture by the same scale, until the ImageView can wrap the picture completely , Also one side of the picture and the imageview corresponding side length are equal. However, there is no guarantee that there is no space between the picture and the component. The width of the film should be enlarged by 3 times times, and the Gaoyao enlarged twice times. Then it will be magnified twice times, when the height is just full of the whole component, but the width and the left side of the gap.

Centerinside: When the size of the ImageView is larger than the size of the picture, the picture is centered, no zoom is made, and when the size of the ImageView is smaller than the size of the picture, the maximum value in the length-to-width reduction scale is selected and then centered, This is similar to Fitcenter.

Centercrop: The picture is scaled and then the middle part of the picture is displayed. If the ImageView is larger than the size of the picture, select the largest value in the aspect magnification to zoom in, or if the ImageView is larger than the size of the picture, select the minimum value in the aspect scale to zoom out. The purpose of this is to ensure that no matter whether the image is enlarged or zoomed out, the picture will fill the ImageView without leaving any gaps .

CheckBox and RadioButton

It is often necessary to customize both of these components, that is, to replace the pictures. After changing the icon, you will find that two of them all occupy a certain amount of white space.

Results such as:


Click on the Red Box section, as you can tick the check box. This is because the system defaults to both with a transparent background. You only need to @null them in the layout file for their background properties . Additionally:the value of the button is also @null.

Of course, you can also adopt a custom composite control method, but it is more troublesome.

The specific style style is:

    <style name= "MyCheckBox" parent= "@android: Style/widget.compoundbutton.checkbox" > <item name= "android:b Ackground "> @null </item> <item name=" Android:layout_width ">wrap_content</item> <item Name= "Android:layout_height" >wrap_content</item> <item name= "Android:layout_gravity" >center_ vertical</item> <item name= "Android:button" > @null </item> <item name= "Android:layout_mar Ginleft ">20dp</item> <item name=" android:drawablepadding ">5dp</item> <item name=" and Roid:drawableright "> @drawable/activity_contactor_select_selector</item> <item name=" Android: TextColor "> #27415C </item> <item name=" android:textsize ">14sp</item> <item name=" Android Oid:layout_margintop ">5dp</item> <item name=" Android:layout_marginbottom ">5dp</item> </s Tyle>
where the value of Drawableright is a selector, which defines both the selected and unchecked styles. as follows:<
    <item android:drawable= "@drawable/selected" android:state_checked= "true" ></item>    <item Android :d rawable= "@drawable/no_selected" android:state_checked= "false" ></item>    <item android:drawable= " @drawable/no_selected "></item>

View Getting Started

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.