VIEW CUSTOMIZATIONIN A NUTSHELL
@bernhardpflug
plus.google.com/+BernhardPflug
Iconmobile170
Headquarter
BMW
BMW remote apps
The app
UX Don’t just start coding
Make it easy to send feedback
Analyse usage
One UX example
Custom view drawing with animation
public class TankView extends ViewGroup { ! . . . !
private void updateBoilerAppearance() { . . . liquidPaths[i] = new Path(); liquidPaints[i] = new Paint(liquidPaint); liquidPaints[i].setShader(new LinearGradient(. . .}, new float[] { . . . }, Shader.TileMode.CLAMP)); ! liquidPaths[i].moveTo(. . .); liquidPaths[i].lineTo(. . .); liquidPaths[i].quadTo(. . .);
. . . ! liquidPathEffects[i].add(new DashPathEffect(new float[] { . . . )); ! } !
. . . } !!
!@Overrideprotected void dispatchDraw(Canvas canvas) { canvas.saveLayerAlpha(0, 0, canvas.getWidth(), canvas.getHeight(), alpha, Canvas.HAS_ALPHA_LAYER_SAVE_FLAG); canvas.drawPath(boilerContour, contourPaint); . . . if (state == State.HEATING) { // draw pipe canvas.drawRect(pipeBounds, fillPaint); canvas.drawLine(. . . ); canvas.drawLine(. . . ); // draw liquid for (int i = 0; i < liquidPaths.length; i++) { canvas.drawPath(liquidPaths[i], liquidPaints[i]); } liquidAnimHandler.postDelayed(liquidAnimation, 50); } }
Custom view drawing with animation
@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) { updateBoilerAppearance(); super.onSizeChanged(w, h, oldw, oldh);}
Custom view drawing with animation
public class SvgView extends View { ! . . . ! @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); if (w > 0 && h > 0 && svg != null) { svg.setDocumentWidth(w); svg.setDocumentHeight(h); Bitmap svgBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); Canvas bitmapCanvas = new Canvas(svgBitmap); // Render our document onto our canvas svg.renderToCanvas(bitmapCanvas); setBackgroundDrawable(new BitmapDrawable(getResources(), svgBitmap)); } } ! . . . }
Consider SVG instead of dpi graphics
{} @ github.com/bernhardpflug/AndroidUtilities
Custom swipe component
Custom swipe component
Ground View
Sky View
public class VerticalViewPager extends ViewGroup { . . . ! @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { int width = getDefaultSize(0, widthMeasureSpec); int height = getDefaultSize(0, heightMeasureSpec); setMeasuredDimension(width, height); int hPadding = getPaddingLeft()+getPaddingRight(); int vPadding = getPaddingTop()+getPaddingBottom(); int contentWidth = getChildMeasureSpec(widthMeasureSpec, hPadding , width); int contentHeight = getChildMeasureSpec(heightMeasureSpec,vPadding , height); groundView.measure(contentWidth, contentHeight); int skyViewHeight = skyView.getLayoutParams().height; int skyHeight = getChildMeasureSpec(heightMeasureSpec, vPadding, skyViewHeight); skyView.measure(contentWidth, skyHeight); } ! . . . !}
Implementing custom swipe components
{} @ github.com/bernhardpflug/AndroidUtilities
Ground View
Sky View
@Override protected void onLayout(boolean changed, int l, int t, int r, int b) { final int width = r - l; final int height = b - t; int skyViewHeight = skyView.getMeasuredHeight(); skyView.layout(0, 0, width, skyView.getMeasuredHeight()); groundView.layout(0, skyViewHeight, width, height + skyViewHeight); }
Implementing custom swipe components
{} @ github.com/bernhardpflug/AndroidUtilities
Ground View
Sky View
@Overridepublic boolean onTouchEvent(MotionEvent event) { ! . . . ! switch (event.getAction()) {
. . . case MotionEvent.ACTION_MOVE: ! int touchSlop = ViewConfiguration.get(getContext()).getScaledTouchSlop(); if (!verticalScrolling && Math.abs(deltaY) > touchSlop) { verticalScrolling = true; requestDisallowInterceptTouchEvent(true); ! if (getScrollY() + deltaY <= State.CLOSED && getScrollY() + deltaY >= State.OPEN) { scrollBy(0, (int) deltaY); } } !!}
Implementing custom swipe components
{} @ github.com/bernhardpflug/AndroidUtilities
@Overridepublic boolean onTouchEvent(MotionEvent event) { ! . . . ! switch (event.getAction()) {
. . . case MotionEvent.ACTION_UP: scroller.startScroll(0, getScrollY(), 0, getY(destinationState) - getScrollY()); break; !!}
Implementing custom swipe components
{} @ github.com/bernhardpflug/AndroidUtilities
@Overridepublic void computeScroll() { if (scroller.computeScrollOffset()) { int x = scroller.getCurrX(); int y = scroller.getCurrY(); scrollTo(x, y); postInvalidate(); } }
Implementing custom swipe components
{} @ github.com/bernhardpflug/AndroidUtilities
at.bernhardpflug.heating
Give it a try
Google Play
{} @ github.com/bernhardpflug/AndroidUtilities
Thank you!
plus.google.com/+BernhardPflug
@bernhardpflug