c# - How to create a square button? -
thanks @justin xl , @grek40 me much.
must apologize poor english troubles much.
, think need improve question others in furture.
here newest:
need make square button this:
programme fullscreen programme different device has different window's size.
square button should can resizeable beaucase want make reactive ui.
, how can make square button?
thank you.
use rectangle.stretch
property:
<rectangle fill="red" stretch="uniform"></rectangle>
i think answers actual question of creating rectangle width , height same , rectangle stretched available space.
in terms of binding, multibinding
on both width
, height
imultivalueconverter
implementation returns minimum of input values might work. however, it's needed controls don't provide automated stretching.
you can use attached properties set same width/height given limit:
public static class squaresize { public static double getwidthlimit(dependencyobject obj) { return (double)obj.getvalue(widthlimitproperty); } public static void setwidthlimit(dependencyobject obj, double value) { obj.setvalue(widthlimitproperty, value); } public static readonly dependencyproperty widthlimitproperty = dependencyproperty.registerattached( "widthlimit", typeof(double), typeof(squaresize), new frameworkpropertymetadata(double.positiveinfinity, new propertychangedcallback(onwidthlimitchanged))); private static void onwidthlimitchanged(dependencyobject d, dependencypropertychangedeventargs e) { updatesize(d, (double)e.newvalue, getheightlimit(d)); } public static double getheightlimit(dependencyobject obj) { return (double)obj.getvalue(heightlimitproperty); } public static void setheightlimit(dependencyobject obj, double value) { obj.setvalue(heightlimitproperty, value); } public static readonly dependencyproperty heightlimitproperty = dependencyproperty.registerattached( "heightlimit", typeof(double), typeof(squaresize), new frameworkpropertymetadata(double.positiveinfinity, new propertychangedcallback(onheightlimitchanged))); private static void onheightlimitchanged(dependencyobject d, dependencypropertychangedeventargs e) { updatesize(d, getwidthlimit(d), (double)e.newvalue); } private static void updatesize(dependencyobject d, double widthlimit, double heightlimit) { double resultsize = math.min(widthlimit, heightlimit); d.setcurrentvalue(frameworkelement.widthproperty, resultsize); d.setcurrentvalue(frameworkelement.heightproperty, resultsize); } }
use appropriate xmlns namespace
<border x:name="border" grid.column="1" grid.row="1"> <rectangle fill="red" local:squaresize.widthlimit="{binding elementname=border,path=actualwidth}" local:squaresize.heightlimit="{binding elementname=border,path=actualheight}"/> </border>
a solution involving custom control wrapper square-spaced content:
public class squarecontentcontrol : contentcontrol { protected override size arrangeoverride(size arrangebounds) { var sizelimit = math.min(arrangebounds.width, arrangebounds.height); if (visualchildrencount > 0) { var child = getvisualchild(0) uielement; if (child != null) { child.arrange(new rect(new point((arrangebounds.width - sizelimit) / 2, (arrangebounds.height - sizelimit) / 2), new size(sizelimit, sizelimit))); return arrangebounds; } } return base.arrangeoverride(arrangebounds); } protected override size measureoverride(size constraint) { var sizelimit = math.min(constraint.width, constraint.height); if (visualchildrencount > 0) { var child = getvisualchild(0) uielement; if (child != null) { child.measure(new size(sizelimit, sizelimit)); return child.desiredsize; } } return base.measureoverride(constraint); } }
usage:
<border x:name="border" grid.column="1" grid.row="1"> <local:squarecontentcontrol> <rectangle fill="red"/> </local:squarecontentcontrol> </border>
Comments
Post a Comment