xaml - How to test the value of a ListView.ItemTemplate before showing a MenuFlyout -
i develop universal app using mvvm-light, , need manage comments on page. on page, show list of comments, , want show menuflyout allows user edit or delete comments:
by following link using behavior open attached flyouts in windows 8.1 store apps, managed show menuflyout when item of listview tapped.
=> display menuflyout if user author of selected comment... there way this?
here xaml:
<listview x:name="mycomments" itemssource="{binding comments}" isitemclickenabled="true" selectionmode="single" selecteditem="{binding selectedcomment}" continuumnavigationtransitioninfo.exitelementcontainer="true"> <listview.itemtemplate> <datatemplate> <stackpanel margin="0,0,19,12" horizontalalignment="stretch"> <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="*" /> </grid.columndefinitions> <!-- 1. author --> <textblock grid.column="0" text="{binding name}" horizontalalignment="stretch" verticalalignment="center" textalignment="left" margin="0" foreground="{staticresource themebrush}" style="{staticresource listviewitemsubheadertextblockstyle}" /> <!-- 2. date --> <textblock grid.column="1" text="{binding date, converter={staticresource datetostringconverter}}" horizontalalignment="stretch" verticalalignment="center" textalignment="right" margin="0" foreground="{staticresource themebrush}" style="{staticresource listviewitemsubheadertextblockstyle}" /> </grid> <!-- 3. content --> <textblock text="{binding content}" textalignment="left" textwrapping="wrap" margin="0" foreground="black" fontsize="20" style="{staticresource groupheadertextblockstyle}" /> <!-- menuflyout - commands --> <flyoutbase.attachedflyout> <menuflyout> <menuflyout.menuflyoutpresenterstyle> <style targettype="menuflyoutpresenter"> <setter property="background" value="{staticresource themebrush}"/> </style> </menuflyout.menuflyoutpresenterstyle> <menuflyoutitem text="edit" command="binding elementname=mypage, path=datacontext.editcommentcommand}"/> <menuflyoutitem text="delete" command="{binding elementname=mypage, path=datacontext.deletecommentcommand}"/> </menuflyout> </flyoutbase.attachedflyout> <!-- behavior --> <i:interaction.behaviors> <core:eventtriggerbehavior eventname="tapped"> <local:openflyoutaction /> </core:eventtriggerbehavior> </i:interaction.behaviors> </stackpanel> </datatemplate> </listview.itemtemplate> <listview.itemcontainerstyle> <style targettype="listviewitem"> <setter property="horizontalcontentalignment" value="stretch" /> </style> </listview.itemcontainerstyle> </listview> and here code-cehind:
public class openflyoutaction : dependencyobject, iaction { public object execute(object sender, object parameter) { flyoutbase.showattachedflyout((frameworkelement)sender); return null; } } => possible show flyoutbase directly in viewmodel instead of code-behind?
i've first created topic because encountered problem on menuflyoutitem , command: xaml - menuflyoutitem attached listview doesn't work in wp8.1 tell me if have continue on topic , delete one.
in complement answer @ depechie on datatemplateselector, here i've done:
i create datatemplateselector class called "commentstemplateselector":
public class commentstemplateselector : datatemplateselector { public datatemplate usercomment { get; set; } public datatemplate nousercomment { get; set; } protected override datatemplate selecttemplatecore(object item) { commentaire comment = (commentaire)item; if (comment.isauthor) return usercomment; else return nousercomment; } } i declare datatemplateselector , associated templates in page's resources:
<page.resources> <!-- templateselectors --> <ts:commentstemplateselector x:key="commentstemplateselector" /> <!-- datatemplates --> <!-- usercomment : menuflyout --> <datatemplate x:key="usercomment"> <border tapped="border_tapped"> <stackpanel margin="0,0,19,12" horizontalalignment="stretch"> <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="*" /> </grid.columndefinitions> <!-- 1. author --> <textblock grid.column="0" text="{binding name}" ... /> <!-- 2. date --> <textblock grid.column="1" text="{binding date, converter={staticresource datetostringconverter}}" ... /> </grid> ... </stackpanel> <!-- menuflyout --> <flyoutbase.attachedflyout> <menuflyout> <menuflyout.menuflyoutpresenterstyle> <style targettype="menuflyoutpresenter"> <setter property="background" value="{staticresource themebrush}"/> </style> </menuflyout.menuflyoutpresenterstyle> <menuflyoutitem text="edit" command="{binding elementname=commentspage, path=datacontext.editcommentcommand}" /> </menuflyoutitem> <menuflyoutitem text="delete" command="{binding elementname=commentspage, path=datacontext.deletecommentcommand}" /> </menuflyout> </flyoutbase.attachedflyout> <i:interaction.behaviors> <core:eventtriggerbehavior eventname="tapped"> <local:openflyoutaction /> </core:eventtriggerbehavior> </i:interaction.behaviors> </border> </datatemplate> <!-- nousercomment : without menuflyout --> <datatemplate x:key="nousercomment"> <border tapped="border_tapped" background="red"> <stackpanel margin="0,0,19,12" horizontalalignment="stretch"> <grid> <grid.columndefinitions> <columndefinition width="*" /> <columndefinition width="*" /> </grid.columndefinitions> <!-- 1. author --> <textblock grid.column="0" text="{binding name}" ... /> <!-- 2. date --> <textblock grid.column="1" text="{binding date, converter={staticresource datetostringconverter}}" ... /> </grid> ... </stackpanel> </border> </datatemplate> ... <page.resources> finally, affected itemtemplateselector of listview datatemplateselector:
<listview x:name="mycommentaires" itemssource="{binding commentaires}" isitemclickenabled="true" itemtemplateselector="{staticresource commentstemplateselector}" selectionmode="single" selecteditem="{binding selectedcommentaire, mode=twoway}" continuumnavigationtransitioninfo.exitelementcontainer="true"> when launch app, go class "commentstemplateselector" , works fine, listview shows model name each items:
so think there binding problem in datatemplates it?
Comments
Post a Comment