1. Creating Custom Views
Kewang

2. A custom view should be...
2

3. A custom view should be...
Conformity
XMLify
Accessibility
Compatibility
3

4. Let's implement
4

5. public class PieChart extends View {
public PieChart(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}
public PieChart(Context context) {
super(context);
}
init(context, null); Constructors
private void init(Context context, AttributeSet attrs) {
}
}
5

6. <resources>
<declare-styleable name="PieChart">
<attr name="showText" format="boolean" />
<attr name="labelPosition" format="enum">
<enum name="left" value="0" />
<enum name="right" value="1" />
</attr>
</declare-styleable>
</resources>
/res/values/attrs.xml
6

7. <?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/androi
d"
xmlns:custom="http://schemas.android.com/apk/res/com.exa
mple.customview" >
<com.example.customview.PieChart
custom:labelPosition="left"
custom:showText="true" />
</LinearLayout>
/res/layout/main.xml
7

8. private void init(Context context, AttributeSet attrs) {
TypedArray a =
context.getTheme().obtainStyledAttributes(attrs,
R.styleable.PieChart, 0, 0);
try {
mShowText =
a.getBoolean(R.styleable.PieChart_showText, false);
mTextPos =
a.getInteger(R.styleable.PieChart_labelPosition, 0);
} finally {
a.recycle();
}
}
The author's initialization
8

9. private void init(Context context, AttributeSet attrs) {
if (attrs != null) {
TypedArray a = context.obtainStyledAttributes(attrs,
R.styleable.PieChart);
mShowText =
a.getBoolean(R.styleable.PieChart_showText, false);
mTextPos =
a.getInteger(R.styleable.PieChart_labelPosition, 0);
a.recycle();
}
} My initialization
9

10. onDraw()
10

11. What to draw? Canvas
How to draw? Paint
11

12. before onDraw(),
should onMeasure()
12

13. @Override
protected void onMeasure(int widthMeasureSpec,
int heightMeasureSpec) {
int minw = getPaddingLeft() + getPaddingRight()
+ getSuggestedMinimumWidth();
int w = resolveSize(minw, widthMeasureSpec);
int h = resolveSize(MeasureSpec.getSize(w),
heightMeasureSpec);
setMeasuredDimension(w, h);
}
MUST setMeasuredDimension
13

14. float start = 0.f;
for (int i = 0; i < series.size(); i++) {
float sweep = (float) (series.get(i) / sum * 360.f);
paint.setColor(Color.rgb(0xff, 0xff, 0xff));
canvas.drawArc(oval, start, sweep, true, paint);
start += sweep;
}
onDraw()
14

15. then invalidate()
15

16. Interactive
16

17. View
boolean onTouchEvent()
ACTION_DOWN
All TouchEvent: return true;
onClick(): return false;
17

18. ViewGroup
boolean onInterceptTouchEvent()
ACTION_DOWN
handle self: return true;
pass to child: return false;
18

19. Derive from onTouchEvent()
onClick(), onLongClick()
onDown(), onFling()
onLongPress,() onScroll()
onShowPress(), onSingleTapUp()
19

20. Optimizing
20

21. Do Less, Less Frequently
onDraw()
invalidate()
requestLayout()
21

22. onDraw()
eliminate allocations
22

23. invalidate()
invalidate(Rect)
invalidate(int, int, int, int)
23

24. requestLayout()
if has complex UI
custom ViewGroup
24

25. References
Creating a View Class
Custom Drawing
Making the View Interactive
Optimizing the View
25

26. 26