c# - Centering text vertically and horizontally in TextBlock and PasswordBox in windows store app -
i trying center text in textblock , passwordbox.
in textblock use textalignment property center text horizontally, still close top. how center text vertically?
and in passwordbox there no property associate text alignment, how achieve this??
textalignment horizontal alignment. textblock doesn't suport vertical alignment.
i suggest put border around , let border vertical alignment:
<border borderbrush="{x:null}" height="50"> <textblock text="your text" verticalalignment="center"/> </border> or other way using height , set padding within textblock.
for password box use in wpf:
<passwordbox horizontalcontentalignment="center" verticalcontentalignment="center" /> for silverlight need extract actual template of passwordbox (use blend allows edit template , copy that) can change members (on contentelement of type border) template binding like:
horizontalalignment="{templatebinding horizontalcontentalignment}" verticalalignment="{templatebinding verticalcontentalignment}" you can template @ msdn link.
for passworbox in silverlight update password box style in xaml this:
<controltemplate x:key="validationtooltiptemplate"> <grid x:name="root" margin="5,0" rendertransformorigin="0,0" opacity="0"> <grid.rendertransform> <translatetransform x:name="xform" x="-25"/> </grid.rendertransform> <visualstatemanager.visualstategroups> <visualstategroup name="openstates"> <visualstategroup.transitions> <visualtransition generatedduration="0"/> <visualtransition to="open" generatedduration="0:0:0.2"> <storyboard> <doubleanimation storyboard.targetname="xform" storyboard.targetproperty="x" to="0" duration="0:0:0.2"> <doubleanimation.easingfunction> <backease amplitude=".3" easingmode="easeout"/> </doubleanimation.easingfunction> </doubleanimation> <doubleanimation storyboard.targetname="root" storyboard.targetproperty="opacity" to="1" duration="0:0:0.2"/> </storyboard> </visualtransition> </visualstategroup.transitions> <visualstate x:name="closed"> <storyboard> <doubleanimation storyboard.targetname="root" storyboard.targetproperty="opacity" to="0" duration="0"/> </storyboard> </visualstate> <visualstate x:name="open"> <storyboard> <doubleanimation storyboard.targetname="xform" storyboard.targetproperty="x" to="0" duration="0"/> <doubleanimation storyboard.targetname="root" storyboard.targetproperty="opacity" to="1" duration="0"/> </storyboard> </visualstate> </visualstategroup> </visualstatemanager.visualstategroups> <border margin="4,4,-4,-4" background="#052a2e31" cornerradius="5"/> <border margin="3,3,-3,-3" background="#152a2e31" cornerradius="4"/> <border margin="2,2,-2,-2" background="#252a2e31" cornerradius="3"/> <border margin="1,1,-1,-1" background="#352a2e31" cornerradius="2"/> <border background="#ffdc000c" cornerradius="2"/> <border cornerradius="2"> <textblock uselayoutrounding="false" foreground="white" margin="8,4,8,4" maxwidth="250" textwrapping="wrap" text="{binding (validation.errors)[0].errorcontent}"/> </border> </grid> </controltemplate> <style targettype="passwordbox"> <setter property="borderthickness" value="1" /> <setter property="background" value="#ffffffff" /> <setter property="foreground" value="#ff000000" /> <setter property="padding" value="2" /> <setter property="borderbrush"> <setter.value> <lineargradientbrush endpoint="0.5,1" startpoint="0.5,0"> <gradientstop color="#ffa3aeb9" offset="0"/> <gradientstop color="#ff8399a9" offset="0.375"/> <gradientstop color="#ff718597" offset="0.375"/> <gradientstop color="#ff617584" offset="1"/> </lineargradientbrush> </setter.value> </setter> <setter property="template"> <setter.value> <controltemplate targettype="passwordbox"> <grid x:name="rootelement"> <visualstatemanager.visualstategroups> <visualstategroup x:name="commonstates"> <visualstate x:name="normal" /> <visualstate x:name="mouseover"> <storyboard> <coloranimation storyboard.targetname="mouseoverborder" storyboard.targetproperty="(border.borderbrush).(solidcolorbrush.color)" to="#ff99c1e2" duration="0"/> </storyboard> </visualstate> <visualstate x:name="disabled"> <storyboard> <doubleanimation storyboard.targetname="disabledvisualelement" storyboard.targetproperty="opacity" to="1" duration="0"/> </storyboard> </visualstate> </visualstategroup> <visualstategroup x:name="focusstates"> <visualstate x:name="focused"> <storyboard> <doubleanimation storyboard.targetname="focusvisualelement" storyboard.targetproperty="opacity" to="1" duration="0"/> </storyboard> </visualstate> <visualstate x:name="unfocused"> <storyboard> <doubleanimation storyboard.targetname="focusvisualelement" storyboard.targetproperty="opacity" to="0" duration="0"/> </storyboard> </visualstate> </visualstategroup> <visualstategroup x:name="validationstates"> <visualstate x:name="valid"/> <visualstate x:name="invalidunfocused"> <storyboard> <objectanimationusingkeyframes storyboard.targetname="validationerrorelement" storyboard.targetproperty="visibility"> <discreteobjectkeyframe keytime="0" > <discreteobjectkeyframe.value> <visibility>visible</visibility> </discreteobjectkeyframe.value> </discreteobjectkeyframe> </objectanimationusingkeyframes> </storyboard> </visualstate> <visualstate x:name="invalidfocused"> <storyboard> <objectanimationusingkeyframes storyboard.targetname="validationerrorelement" storyboard.targetproperty="visibility"> <discreteobjectkeyframe keytime="0" > <discreteobjectkeyframe.value> <visibility>visible</visibility> </discreteobjectkeyframe.value> </discreteobjectkeyframe> </objectanimationusingkeyframes> <objectanimationusingkeyframes storyboard.targetname="validationtooltip" storyboard.targetproperty="isopen"> <discreteobjectkeyframe keytime="0" > <discreteobjectkeyframe.value> <sys:boolean>true</sys:boolean> </discreteobjectkeyframe.value> </discreteobjectkeyframe> </objectanimationusingkeyframes> </storyboard> </visualstate> </visualstategroup> </visualstatemanager.visualstategroups> <border x:name="border" borderthickness="{templatebinding borderthickness}" cornerradius="1" opacity="1" background="{templatebinding background}" borderbrush="{templatebinding borderbrush}"> <border x:name="mouseoverborder" borderthickness="1" borderbrush="transparent"> <border x:name="contentelement" margin="{templatebinding padding}" horizontalalignment="{templatebinding horizontalcontentalignment}" verticalalignment="{templatebinding verticalcontentalignment}"/> </border> </border> <border x:name="disabledvisualelement" background="#a5f7f7f7" borderbrush="#a5f7f7f7" borderthickness="{templatebinding borderthickness}" opacity="0" ishittestvisible="false"/> <border x:name="focusvisualelement" borderbrush="#ff6dbdd1" borderthickness="{templatebinding borderthickness}" margin="1" opacity="0" ishittestvisible="false"/> <border x:name="validationerrorelement" borderthickness="1" cornerradius="1" borderbrush="#ffdb000c" visibility="collapsed"> <tooltipservice.tooltip> <tooltip x:name="validationtooltip" template="{staticresource validationtooltiptemplate}" placement="right" placementtarget="{binding relativesource={relativesource templatedparent}}" datacontext="{binding relativesource={relativesource templatedparent}}"> <tooltip.triggers> <eventtrigger routedevent="canvas.loaded"> <eventtrigger.actions> <beginstoryboard> <storyboard> <objectanimationusingkeyframes storyboard.targetname="validationtooltip" storyboard.targetproperty="ishittestvisible"> <discreteobjectkeyframe keytime="0" > <discreteobjectkeyframe.value> <sys:boolean>true</sys:boolean> </discreteobjectkeyframe.value> </discreteobjectkeyframe> </objectanimationusingkeyframes> </storyboard> </beginstoryboard> </eventtrigger.actions> </eventtrigger> </tooltip.triggers> </tooltip> </tooltipservice.tooltip> <grid width="12" height="12" horizontalalignment="right" margin="1,-4,-4,0" verticalalignment="top" background="transparent"> <path margin="1,3,0,0" data="m 1,0 l6,0 2,2 90 0 1 8,2 l8,7 z" fill="#ffdc000c"/> <path margin="1,3,0,0" data="m 0,0 l2,0 l 8,6 l8,8" fill="#ffffff"/> </grid> </border> </grid> </controltemplate> </setter.value> </setter> </style> then passwordbox can have alignment such:
<passwordbox horizontalcontentalignment="center" verticalcontentalignment="center"/>
Comments
Post a Comment