(window.webpackJsonp=window.webpackJsonp||[]).push([[264],{672:function(t,e,a){"use strict";a.r(e);var n=a(31),s=Object(n.a)({},(function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[a("h1",{attrs:{id:"paint"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#paint"}},[t._v("#")]),t._v(" Paint")]),t._v(" "),a("p",[t._v("A paint is one of the four objects needed to draw, along with a Canvas (holds drawing calls), a Bitmap (holds the pixels), and a drawing primitive (Rect, Path, Bitmap...)")]),t._v(" "),a("h2",{attrs:{id:"creating-a-paint"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#creating-a-paint"}},[t._v("#")]),t._v(" Creating a Paint")]),t._v(" "),a("p",[t._v("You can create a new paint with one of these 3 constructors:")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("new Paint()")]),t._v(" Create with default settings")]),t._v(" "),a("li",[a("code",[t._v("new Paint(int flags)")]),t._v(" Create with flags")]),t._v(" "),a("li",[a("code",[t._v("new Paint(Paint from)")]),t._v(" Copy settings from another paint")])]),t._v(" "),a("p",[t._v("It is generally suggested to never create a paint object, or any other object in onDraw() as it can lead to performance issues. (Android Studio will probably warn you) Instead, make it global and initialize it in your class constructor like so:")]),t._v(" "),a("div",{staticClass:"language-java extra-class"},[a("pre",{pre:!0,attrs:{class:"language-java"}},[a("code",[a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("public")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("class")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("CustomView")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("extends")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("View")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n \n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("private")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),t._v(" paint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n \n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("public")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("CustomView")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Context")]),t._v(" context"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("super")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("context"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n paint "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("new")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token comment"}},[t._v("//...")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n \n "),a("span",{pre:!0,attrs:{class:"token annotation punctuation"}},[t._v("@Override")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("protected")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("void")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("onDraw")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Canvas")]),t._v(" canvas"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("super")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("onDraw")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("canvas"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n paint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("setColor")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token number"}},[t._v("0xFF000000")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// ...")]),t._v("\n "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("}")]),t._v("\n\n")])])]),a("h2",{attrs:{id:"setting-up-paint-for-text"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#setting-up-paint-for-text"}},[t._v("#")]),t._v(" Setting up Paint for text")]),t._v(" "),a("h3",{attrs:{id:"text-drawing-settings"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#text-drawing-settings"}},[t._v("#")]),t._v(" "),a("strong",[t._v("Text drawing settings")])]),t._v(" "),a("ul",[a("li",[a("code",[t._v("setTypeface(Typeface typeface)")]),t._v(" Set the font face. See "),a("a",{attrs:{href:"https://developer.android.com/reference/android/graphics/Typeface.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("Typeface"),a("OutboundLink")],1)]),t._v(" "),a("li",[a("code",[t._v("setTextSize(int size)")]),t._v(" Set the font size, in pixels.")]),t._v(" "),a("li",[a("code",[t._v("setColor(int color)")]),t._v(" Set the paint drawing color, including the text color. You can also use "),a("code",[t._v("setARGB(int a, int r, int g, int b")]),t._v(" and "),a("code",[t._v("setAlpha(int alpha)")])]),t._v(" "),a("li",[a("code",[t._v("setLetterSpacing(float size)")]),t._v(" Set the spacing between characters, in ems. Default value is 0, a negative value will tighten the text, while a positive one will expand it.")]),t._v(" "),a("li",[a("code",[t._v("setTextAlign(Paint.Align align)")]),t._v(" Set text alignment relative to its origin. "),a("code",[t._v("Paint.Align.LEFT")]),t._v(" will draw it to the right of the origin, "),a("code",[t._v("RIGHT")]),t._v(" will draw it to the left, and "),a("code",[t._v("CENTER")]),t._v(" will draw it centered on the origin (horizontally)")]),t._v(" "),a("li",[a("code",[t._v("setTextSkewX(float skewX)")]),t._v(" This could be considered as fake italic. SkewX represents the horizontal offset of the text bottom. (use -0.25 for italic)")]),t._v(" "),a("li",[a("code",[t._v("setStyle(Paint.Style style)")]),t._v(" Fill text "),a("code",[t._v("FILL")]),t._v(", Stroke text "),a("code",[t._v("STROKE")]),t._v(", or both "),a("code",[t._v("FILL_AND_STROKE")])])]),t._v(" "),a("p",[t._v("Note that you can use "),a("code",[t._v("TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, size, getResources().getDisplayMetrics())")]),t._v(" to convert from SP or DP to pixels.")]),t._v(" "),a("h3",{attrs:{id:"measuring-text"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#measuring-text"}},[t._v("#")]),t._v(" "),a("strong",[t._v("Measuring text")])]),t._v(" "),a("ul",[a("li",[a("code",[t._v("float width = paint.measureText(String text)")]),t._v(" Measure the width of text")]),t._v(" "),a("li",[a("code",[t._v("float height = paint.ascent()")]),t._v(" Measure the height of text")]),t._v(" "),a("li",[a("code",[t._v("paint.getTextBounds(String text, int start, int end, Rect bounds")]),t._v(" Stores the text dimensions. You have allocate the Rect, it cannot be null:")])]),t._v(" "),a("div",{staticClass:"language- extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('\nString text = "Hello world!";\n Rect bounds = new Rect();\n paint.getTextBounds(text, 0, text.length(), bounds);\n\n')])])]),a("p",[t._v("There are other methods for measuring, however these three should fit most purposes.")]),t._v(" "),a("h2",{attrs:{id:"setting-up-paint-for-drawing-shapes"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#setting-up-paint-for-drawing-shapes"}},[t._v("#")]),t._v(" Setting up Paint for drawing shapes")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("setStyle(Paint.Style style)")]),t._v(" Filled shape "),a("code",[t._v("FILL")]),t._v(", Stroke shape "),a("code",[t._v("STROKE")]),t._v(", or both "),a("code",[t._v("FILL_AND_STROKE")])]),t._v(" "),a("li",[a("code",[t._v("setColor(int color)")]),t._v(" Set the paint drawing color. You can also use "),a("code",[t._v("setARGB(int a, int r, int g, int b")]),t._v(" and "),a("code",[t._v("setAlpha(int alpha)")])]),t._v(" "),a("li",[a("code",[t._v("setStrokeCap(Paint.Cap cap)")]),t._v(" Set line caps, either "),a("code",[t._v("ROUND")]),t._v(", "),a("code",[t._v("SQUARE")]),t._v(", or "),a("code",[t._v("BUTT")]),t._v(" (none) See "),a("a",{attrs:{href:"https://elevenworks.gitbooks.io/touchdraw-for-ipad/content/attachments/3247710/8806443.png",target:"_blank",rel:"noopener noreferrer"}},[t._v("this"),a("OutboundLink")],1),t._v(".")]),t._v(" "),a("li",[a("code",[t._v("setStrokeJoin(Paint.Join join)")]),t._v(" Set line joins, either "),a("code",[t._v("MITER")]),t._v(" (pointy), "),a("code",[t._v("ROUND")]),t._v(", or "),a("code",[t._v("BEVEL")]),t._v(". See "),a("a",{attrs:{href:"https://www.w3.org/TR/SVG/images/painting/linejoin.svg",target:"_blank",rel:"noopener noreferrer"}},[t._v("this"),a("OutboundLink")],1),t._v(".")]),t._v(" "),a("li",[a("code",[t._v("setStrokeMiter(float miter)")]),t._v(" Set miter join limit. This can prevent miter join from going on indefinitively, turning it into a bevel join after x pixels. See "),a("a",{attrs:{href:"http://www.mikeswanson.com/blog/images/Miter%20Limit%20Illustration.gif",target:"_blank",rel:"noopener noreferrer"}},[t._v("this"),a("OutboundLink")],1),t._v(".")]),t._v(" "),a("li",[a("code",[t._v("setStrokeWidth(float width)")]),t._v(" Set stroke width. "),a("code",[t._v("0")]),t._v(" will draw in hairline mode, independant of the canvas matrix. (always 1 pixel)")])]),t._v(" "),a("h2",{attrs:{id:"setting-flags"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#setting-flags"}},[t._v("#")]),t._v(" Setting flags")]),t._v(" "),a("p",[t._v("You can set the following flags in the constructor, or with "),a("code",[t._v("setFlags(int flags)")])]),t._v(" "),a("ul",[a("li",[a("code",[t._v("Paint.ANTI_ALIAS_FLAG")]),t._v(" Enable antialiasing, smooths the drawing.")]),t._v(" "),a("li",[a("code",[t._v("Paint.DITHER_FLAG")]),t._v(" Enable dithering. If color precision is higher than the device's, "),a("a",{attrs:{href:"http://img11.hostingpics.net/pics/332173dithering.png",target:"_blank",rel:"noopener noreferrer"}},[t._v("this will happen"),a("OutboundLink")],1),t._v(".")]),t._v(" "),a("li",[a("code",[t._v("Paint.EMBEDDED_BITMAP_TEXT_FLAG")]),t._v(" Enables the use of bitmap fonts.")]),t._v(" "),a("li",[a("code",[t._v("Paint.FAKE_BOLD_TEXT_FLAG")]),t._v(" will draw text with a fake bold effect, can be used instead of using a bold typeface. Some fonts have styled bold, "),a("a",{attrs:{href:"https://www.smashingmagazine.com/wp-content/uploads/2012/06/3_big_bolditalic.jpg",target:"_blank",rel:"noopener noreferrer"}},[t._v("fake bold won't"),a("OutboundLink")],1)]),t._v(" "),a("li",[a("code",[t._v("Paint.FILTER_BITMAP_FLAG")]),t._v(" Affects the sampling of bitmaps when transformed.")]),t._v(" "),a("li",[a("code",[t._v("Paint.HINTING_OFF")]),t._v(", "),a("code",[t._v("Paint.HINTING_ON")]),t._v(" Toggles font hinting, see "),a("a",{attrs:{href:"http://showinfo.rietveldacademie.nl/verdana/Image/cap2_5200.JPG",target:"_blank",rel:"noopener noreferrer"}},[t._v("this"),a("OutboundLink")],1)]),t._v(" "),a("li",[a("code",[t._v("Paint.LINEAR_TEXT_FLAG")]),t._v(" Disables font scaling, draw operations are scaled instead")]),t._v(" "),a("li",[a("code",[t._v("Paint.SUBPIXEL_TEXT_FLAG")]),t._v(" Text will be computed using subpixel accuracy.")]),t._v(" "),a("li",[a("code",[t._v("Paint.STRIKE_THRU_TEXT_FLAG")]),t._v(" Text drawn will be striked")]),t._v(" "),a("li",[a("code",[t._v("Paint.UNDERLINE_TEXT_FLAG")]),t._v(" Text drawn will be underlined")])]),t._v(" "),a("p",[t._v("You can add a flag and remove flags like this:")]),t._v(" "),a("div",{staticClass:"language-java extra-class"},[a("pre",{pre:!0,attrs:{class:"language-java"}},[a("code",[a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),t._v(" paint "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("new")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\npaint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("setFlags")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("paint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("getFlags")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("|")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("FLAG"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// Add flag")]),t._v("\npaint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("setFlags")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("paint"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[t._v("getFlags")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("&")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[t._v("~")]),a("span",{pre:!0,attrs:{class:"token class-name"}},[t._v("Paint")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),t._v("FLAG"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[t._v("// Remove flag")]),t._v("\n\n")])])]),a("p",[t._v("Trying to remove a flag that isn't there or adding a flag that is already there won't change anything. Also note that most flags can also be set using "),a("code",[t._v("set(boolean enabled)")]),t._v(", for example "),a("code",[t._v("setAntialias(true)")]),t._v(".")]),t._v(" "),a("p",[t._v("You can use "),a("code",[t._v("paint.reset()")]),t._v(" to reset the paint to its default settings. The only default flag is "),a("code",[t._v("EMBEDDED_BITMAP_TEXT_FLAG")]),t._v(". It will be set even if you use "),a("code",[t._v("new Paint(0)")]),t._v(", you will have")])])}),[],!1,null,null,null);e.default=s.exports}}]);