{"id":15371,"date":"2014-11-20T11:17:13","date_gmt":"2014-11-20T16:17:13","guid":{"rendered":"http:\/\/blog.xamarin.com\/?p=15371"},"modified":"2014-11-20T11:17:13","modified_gmt":"2014-11-20T16:17:13","slug":"real-time-code-iteration-with-sketches","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/xamarin\/real-time-code-iteration-with-sketches\/","title":{"rendered":"Real-Time Code Iteration with Sketches"},"content":{"rendered":"

\t\t\t\tSketches<\/strong> are a powerful new feature that we announced as a preview release at Xamarin Evolve in October. With Sketches, developers can iterate on code within Xamarin Studio and immediately see the results, without having to go through a full build and deploy cycle.<\/p>\n

\"Sketches\"<\/p>\n

A sketch is a file that stands alone or can be contained in a project, making it easy to move experimental code from a sketch into a code base. In some ways, it\u2019s the immediate window on steroids.<\/p>\n

For example, say you want to inspect the result of some code such as :<\/p>\n

\nvar x = 1;\nvar y = 2;\nvar z = x + y;\n<\/pre>\n
Sketches use a REPL (read\u2013eval\u2013print loop) that evaluates the code and displays the results:<\/p>\n
\"sketch<\/p>\n
Viewing Output<\/h2>\n
There are visualizers for the output built in, too. For instance, a color is displayed as shown below:<\/p>\n
\"color<\/p>\n
You can even pin the results to the output area:<\/p>\n
\"color<\/p>\n
Additionally, the output can display graphs of data:<\/p>\n
\"output<\/p>\n
Visualizing Images<\/h2>\n
The visualizer can display other types of data, too, such as images:<\/p>\n
\"image<\/p>\n
Graphics Code<\/h3>\n
Having image support is nice, because it allows you to write arbitrary graphics code in a sketch and render it to an image. For example, here’s a code snippet from a blog post<\/a> I wrote a while back, showing the rendering of some Core Graphics drawing code (updated for the unified API) in an iOS sketch:<\/p>\n
\n\/\/ Sketch your next great idea!\n\nusing UIKit;\nusing Foundation;\nusing CoreGraphics;\n\/\/\nUIGraphics.BeginImageContext (new CGSize (320.0f, 300.0f));\nusing (var gctx = UIGraphics.GetCurrentContext ()){\n\n  gctx.SetLineWidth(4);\n  UIColor.Purple.SetFill ();\n  UIColor.Black.SetStroke ();\n\n  var path = new CGPath ();\n  path.AddLines(new CGPoint[]{\n    new CGPoint(100,200),\n    new CGPoint(160,100),\n    new CGPoint(220,200)});\n  path.CloseSubpath();\n\n  gctx.AddPath(path);\n  gctx.DrawPath(CGPathDrawingMode.FillStroke);\n}\n\nvar image = UIGraphics.GetImageFromCurrentImageContext ();\n\nUIGraphics.EndImageContext ();\n<\/pre>\n
This renders a triangle in the sketch, as shown below:<\/p>\n
\"Core<\/p>\n
Visualizing Views<\/h2>\n
Visualizers aren’t limited to just images. You can display views as well, such as a UIView on iOS or an NSView on OS X. For example, here is an NSBox with a border:<\/p>\n
\"view<\/p>\n
Where sketches start getting even more compelling is when you start using them to modify code running in the iOS simulator and the Xamarin Android Player. For example, here is some Xamarin.Forms code created on the fly in a sketch, running in the Android Player:<\/p>\n
\"forms<\/p>\n
To learn more about Sketches, check out the documentation in our developer center<\/a> and the Sketches’ samples<\/a>. Also see Aaron Bockover<\/a>‘s great talk from Evolve<\/a>.\t\t<\/p>\n","protected":false},"excerpt":{"rendered":"
Sketches are a powerful new feature that we announced as a preview release at Xamarin Evolve in October. With Sketches, developers can iterate on code within Xamarin Studio and immediately see the results, without having to go through a full build and deploy cycle. A sketch is a file that stands alone or can be […]<\/p>\n","protected":false},"author":1932,"featured_media":39167,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2],"tags":[4],"class_list":["post-15371","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-developers","tag-xamarin-platform"],"acf":[],"blog_post_summary":"
Sketches are a powerful new feature that we announced as a preview release at Xamarin Evolve in October. With Sketches, developers can iterate on code within Xamarin Studio and immediately see the results, without having to go through a full build and deploy cycle. A sketch is a file that stands alone or can be […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts\/15371","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/users\/1932"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/comments?post=15371"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/posts\/15371\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/media\/39167"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/media?parent=15371"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/categories?post=15371"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/xamarin\/wp-json\/wp\/v2\/tags?post=15371"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}