I have tried updating the Control.Bounds, Control.Frame, TheButton.Frame, TheButton.Bounds but nothings gets the view to resize. I have tried all manner of methods to get the view in IOS to size correctly. I have code that sets the bindable WidthAndHeight property on the PCL view after i find out the dimensions on the screen. ![]() I am creating a button that uses an SVG as a background (xam.svg on android and Mntone.SvgForXaml on UWP is what i use to get the SVG to actually display and paintcode is what I will use for IOS). I am having some issues with getting the view to layout correctly in IOS. I have a custom view in my PCL and I have built custom renderers on UWP, IOS and Android to render this view. Custom rendererĪgain, inside the Android project we need to add a new class that inherits from ViewRenderer, lets get creative and name it SharpViewRenderer, it’ll have SharpView (from the central project) as TAbstraction and SharpView (from the Android project) as TNative, for this singular case, we’ll use aliases to not confuse the controls: using FormsSharpView = SharpPaintCode. In this case, I called it SharpView but no matter what name you chose, it must inherit from View: public class SharpView : View Once they show up, select them all and on the right panel, just below the Transforms menu click on the small “I” on the square, so that the four lines that join the central dot with the square become zigzagging lines:īy this point you’ll be able to verify that everything is working properly if you change the values of the variables Height y Width on the left panel.īefore we’re done for a minute with PaintCode, select the tab at the top that has “StyleKit” as its name, and then on the right panel modify the properties so they somewhat match your project: Xamarin.Forms codeįirst thing we’re going to do with the code, is create a class that will be the reference for our control. If the drawing you made is a bézier curve (as it is in this case), double click it until some dots appear its path: Pay attention to this next step as it is very important if we want our drawing to adjust whenever the frame changes its size. If you made it right, the color of our drawing will change to the one we set before: Our next task is to link the color we created before ( FillColor) with the fill color of our recently created drawing. So that the Frame’s Width is bound to the Width value from the variables panel, then do the same for Height:Īnd now we’re ready to create our drawing: ![]() Then, with the frame selected, we’re going to drag from the variable panel up to the frame’s properties. Now lets add a couple of variables: Width y Height and make their values the same as our frame size, add them also as Parameters: On the left panel, we need to add a color called FillColor, and have it set as a Parameter: Then, add a Frame, I’ll be calling it SharpFrame: But if you haven’t you must start by adding a new canvas, in this case I’ll name it SharpCanvas and its dimensions are 100 by 100, or a 1:1 ratio, which is the same as the drawing I’ll be creating: If you have previously created and exported graphics using PaintCode, you probably want to skip this section. In this post, I’ll explain how to create a custom control using PaintCode and Xamarin.Forms’ custom renderers, starting from the drawing itself, this post may be a little bit too long but I’m sure it is worth it.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |