Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 220 trang
THÔNG TIN TÀI LIỆU
Cấu trúc
Slide 1
Slide 2
Slide 3
Slide 4
Slide 5
Slide 6
Slide 7
Slide 8
Slide 9
Slide 10
Slide 11
Slide 12
Slide 13
Slide 14
Slide 15
Slide 16
Slide 17
Slide 18
Slide 19
Slide 20
Slide 21
Slide 22
Slide 23
Slide 24
Slide 25
Slide 26
Slide 27
Slide 28
Slide 29
Slide 30
Slide 31
Slide 32
Slide 33
Slide 34
Slide 35
Slide 36
Slide 37
Slide 38
Slide 39
Slide 40
Slide 41
Slide 42
Slide 43
Slide 44
Slide 45
Slide 46
Slide 47
Slide 48
Slide 49
Slide 50
Slide 51
Slide 52
Slide 53
Slide 54
Slide 55
Slide 56
Slide 57
Slide 58
Slide 59
Slide 60
Slide 61
Slide 62
Slide 63
Slide 64
Slide 65
Slide 66
Slide 67
Slide 68
Slide 69
Slide 70
Slide 71
Slide 72
Slide 73
Slide 74
Slide 75
Slide 76
Slide 77
Slide 78
Slide 79
Slide 80
Slide 81
Slide 82
Slide 83
Slide 84
Slide 85
Slide 86
Slide 87
Slide 88
Slide 89
Slide 90
Slide 91
Slide 92
Slide 93
Slide 94
Slide 95
Slide 96
Slide 97
Slide 98
Slide 99
Slide 100
Slide 101
Slide 102
Slide 103
Slide 104
Slide 105
Slide 106
Slide 107
Slide 108
Slide 109
Slide 110
Slide 111
Slide 112
Slide 113
Slide 114
Slide 115
Slide 116
Slide 117
Slide 118
Slide 119
Slide 120
Slide 121
Slide 122
Slide 123
Slide 124
Slide 125
Slide 126
Slide 127
Slide 128
Slide 129
Slide 130
Slide 131
Slide 132
Slide 133
Slide 134
Slide 135
Slide 136
Slide 137
Slide 138
Slide 139
Slide 140
Slide 141
Slide 142
Slide 143
Slide 144
Slide 145
Slide 146
Slide 147
Slide 148
Slide 149
Slide 150
Slide 151
Slide 152
Slide 153
Slide 154
Slide 155
Slide 156
Slide 157
Slide 158
Slide 159
Slide 160
Slide 161
Slide 162
Slide 163
Slide 164
Slide 165
Slide 166
Slide 167
Slide 168
Slide 169
Slide 170
Slide 171
Slide 172
Slide 173
Slide 174
Slide 175
Slide 176
Slide 177
Slide 178
Slide 179
Slide 180
Slide 181
Slide 182
Slide 183
Slide 184
Slide 185
Slide 186
Slide 187
Slide 188
Slide 189
Slide 190
Slide 191
Slide 192
Slide 193
Slide 194
Slide 195
Slide 196
Slide 197
Slide 198
Slide 199
Slide 200
Slide 201
Slide 202
Slide 203
Slide 204
Slide 205
Slide 206
Slide 207
Slide 208
Slide 209
Slide 210
Slide 211
Slide 212
Slide 213
Slide 214
Slide 215
Slide 216
Slide 217
Slide 218
Slide 219
Slide 220
Nội dung
!! "#$% &'()(%!!$% *+',-*+$ .,!', /012$ 3#4 5,6#,7,6 8,7%,%$$ & *+',-*+$ $+', &$9 "!(!( *+',:6$% $6' .!!', " $+', Each element in the XML Layout is either a View or ViewGroup object Displaying the Application‘s View paints the screen by walking the View tree by asking each component to draw itself in a pre-order traversal way. Each component draws itself and then asks each of its children to do the same. &$9 The View class represents the basic building block for user interface components. a rectangular area on the screen responsible for drawing and event handling. is the base class for widgets The ViewGroup subclass is the base class for layouts invisible containers that hold other Views and define inside views layout properties. "!(!( . *+',:6$% 06$*+',; An XML-based layout is a specification of the various UI components (widgets) and the relationships to each other –and to their containers –all written I Android considers XML-based layouts to be resources, and as such layout files are stored in the res/layout directory inside your Android project XML format. You could create Layout XML files using UI tools such as: Eclipse ADT UI Designer (getting better but still…) DroidDraw (to be phased out soon???) Asset Studio (probably the best option, not available yet) / *+',:6$% You must “connect” the XML elements with equivalent objects in your Java activity. This allows you to manipulate the UI with code. setContentView(R.layout.main); Demo: Button is content view :6$%+',< 3 *+',:6$% ! 5 $6' In SDK folder / Tools/ monitor.bat HierarchyViewer displays the UI structure of the current screen shown on the emulator or device. 8 .!!', There are five basic types of Layouts: Frame, Linear, Relative, Table, and Absolute. FrameLayout: simplest type of layout object: a blank space on your screen that you can later fill with a single object All child elements of the FrameLayout are pinned to the top left corner of the screen; you cannot specify a different location for a child view. Subsequent child views will simply be drawn over previous ones, partially or totally obscuring them (unless the newer object is transparent). [...]... widgets are left-and top-aligned You may use the XML property android:layout_gravity=“…” to set other possible arrangements: left, center, right, top, bottom, etc 20 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts LinearLayout: Gravity CAUTION: gravity vs layout_gravity The difference between: android:gravity specifies how to place the content of an object, both on the x-and y-axis, within... Padding is analogous to the margins on a word processing document 22 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts LinearLayout: Padding vs Margin 23 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts LinearLayout: Internal Margins Using Padding Example: The EditTextbox has been changed to display 30dip of padding all around 24 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts LinearLayout:... the issue of empty space Values used in defining height and width are: 1.Specific a particular dimension, such as 125 dip (device independent pixels) 2. Provide wrap_content, which means the widget should fill up its natural space, unless that is too big, in which case Android can use word-wrap as needed to make it fit 3.Provide fill_parent, which means the widget should fill up all available space in... defined by any kind of other View 7.A cell may also be a ViewGroup object 26 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts TableLayout: 27 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts TableLayout: 1.Android's TableLayout allows you to position your widgets in a grid made of identifiable rows and columns 2. Columns might shrink or stretch to accommodate their contents 3.TableLayout... layouts TableLayout: 32 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts TableLayout: By default, each column will be sized according to the "natural" size of the widest widget in that column If your content is narrower than the available space, you can use the TableLayout property: android:stretchColumns= " … " Its value should be a single column number (0-based) or a comma-delimited list of... Marging By default, widgets are tightly packed next to each other To increase space between them use the android:layout_margin attribute 25 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts TableLayout: 1.TableLayout positions its children into rows and columns 2. TableLayout containers do not display border lines 3.The table will have as many columns as the row with the most cells 4.A cell could... weight, gravity, padding , margin 12 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts LinearLayout: aligns all children in a single direction —vertically or horizontally depending on the android:orientation attribute All children are stacked one after the other, (vertical list will only have one child per row, a horizontal list will only be one row high - the height of the tallest child, plus... widgets in a view You set android:layout_weight to a value (1, 2, 3, …) to indicates what proportion of the free space should go to that widget Example Both the TextView and the Button widgets have been set as in the previous example Both have the additional property android:layout_weight="1" whereas the EditTextcontrol has android:layout_weight= "2" Default value is 0 19 HO CHI MINH UNIVERSITY OF INDUSTRY... INDUSTRY 1.6 Common layouts TableLayout: In our running example we stretch columns 2, 3, and 4 to fill the rest of the row 34 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts RelativeLayout: 1.RelativeLayout lets child views specify their position relative to the parent view or to each other(specified by ID) 2. You can align two elements by right border, or make one below another, centered in... 3.TableLayout works in conjunction with TableRow 4.TableLayout controls the overall behavior of the container, with the widgets themselves positioned into one or more TableRow containers, one per row in the grid 28 HO CHI MINH UNIVERSITY OF INDUSTRY 1.6 Common layouts TableLayout: Rows are declared by you by putting widgets as children of a TableRow inside the overall TableLayout The number of columns is determined . !! "#$% &'()(%!!$% *+', - *+$ .,!', /0 12$ 3#4 5,6#,7,6 8,7%,%$$ & *+', - *+$ $+', &$9 "!(!( . such as 125 dip (device independent pixels) 2. Provide wrap_content, which means the widget should fill up its natural space, unless that is too big, in which case Android can use word-wrap as. *+',:6$% 06$*+',; An XML-based layout is a specification of the various UI components (widgets) and the relationships to each other –and to their containers –all written I Android considers XML-based layouts