I have a listview in my xamarin-app:
ListView x:Name="list"
ItemsSource="{Binding Users"
RowHeight="200"
ItemTapped="OnItemSelected"
VerticalOptions="FillAndExpand">
When I click on an Item, I have this method in the CB:
public void OnItemSelected(object sender, ItemTappedEventArgs e)
{
var user = e.Item as User;
if (user == null)
{
//Display dialog with two buttons:
//Edit user or delete user...
}
}
Im hoping to display a simple dialog-box with two buttons. The important thing is that I need to be able to pass the User to the "correct" method depending on the made choice. Help appreciated. Thank you.
There are two kinds of pop-ups in Xamarin Forms - Alerts and Action Sheets.
If you only have two options, an Alert is probably the best choice:
var resp = await DisplayAlert (title, message, optionA, optionB);
resp is a bool that will tell you whether they clicked the first or second option.
Related
I am making a UWP app which is supposed to be on xbox for now and maybe in future ill release it on pc and other platforms. I know that on PC and for mobile we can enable this feature with following 2 properties on the GridView or ListView.
CanReorderItems=True
CanDrop=True
But according to Microsoft Docs, drag and drop feature is not available or supported on xbox.
So what are any other options to achieve this reorder feature on xbox GridView?
UPDATE 1
So here is my backend code for the gridview. selection mode is single but I am not using selectionchanged event because that just creates lot of confusion and for now just assume that we always need to swap the items I will set the boolean later once the swapping in working perfectly.
private void SamplePickerGridView_ChoosingItemContainer(Windows.UI.Xaml.Controls.ListViewBase sender, ChoosingItemContainerEventArgs args)
{
if (args.ItemContainer != null)
{
return;
}
GridViewItem container = (GridViewItem)args.ItemContainer ?? new GridViewItem();
//should be xbox actually after pc testing
if (DeviceTypeHelper.GetDeviceFormFactorType() == DeviceFormFactorType.Desktop)
{
container.GotFocus += Container_GotFocus;
container.LostFocus += Container_LostFocus;
//container.KeyDown += Container_KeyDown;
}
args.ItemContainer = container;
}
private TVShow GotItem, LostItem;
private void Container_LostFocus(object sender, RoutedEventArgs e)
{
LostItem = OnNowAllGridView.ItemFromContainer(e.OriginalSource as GridViewItem) as TVShow;
GotItem = null;
}
private void Container_GotFocus(object sender, RoutedEventArgs e)
{
GotItem = OnNowAllGridView.ItemFromContainer(e.OriginalSource as GridViewItem) as TVShow;
if (GotItem != null && LostItem != null)
{
var focusedItem = GotItem;
var lostitem = LostItem;
var index1 = ViewModel.Source.IndexOf(focusedItem);
var index2 = ViewModel.Source.IndexOf(lostitem);
ViewModel.Source.Move(index1, index2);
}
LostItem = null;
}
u can try the code with adaptivegridview or just normal gridview of uwp if it works with that it should work with adaptivegridview as well.
Current Bheaviour items are swaped but the focus remains at same index.
Expected the focus should also move along with the item.
Your finding is true, drag and drop is not supported on Xbox out of the box (although when mouse support comes to Xbox in the future, I guess it will work).
So if you need this functionality, you will have to implement it manually from the start. One option would be to add a button, that will display on Xbox only and will read like Reorder Grid.
When this "reorder" mode were enabled, you have several solutions available.
The easiest solution for you would be to set the SelectionMode to Single and when a item is selected, you would bring it to fromt of the underlying collection.
collection.Remove( selectedItem );
collection.Insert( 0, selectedItem );
This bring to front solution was implemented on the Xbox One dashboard for reordering tiles.
Second option would be to set the SelectionMode to Multiple, where user would first select one item and then a second one. After that you could move the first selected item before the second selected:
collection.Remove( firstSelectedItem );
var targetIndex = collection.IndexOf( secondSelectedItem );
collection.Insert( targetIndex, firstSelectedItem );
The last solution is the most complex. With SelectionMode = Single you would select a single item and then observe the direction in which the user focus moves and move the tile "in real time". This is the most user friendly, but hardest to implement reliably.
Just as an outline of the third solution - you could capture the GotFocus event if you implement a custom template of the GridView:
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid Orientation="Horizontal"
GotFocus="GridViewItem_GotFocus"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
Now within this GotFocus handler you could retrieve the item that has currently focus from the EventArgs.OriginalSource. This way you could know which item got the focus and you could swap it with the item the user selected.
Update - hacky solution
I have come up with a hacky approach that solves the GotFocus/LostFocus mess.
The problem with GotFocus is that when we move the item in collection, the focus gets confused. But what if we didn't physically move the items at all?
Suppose your item type is TVShow. Let's create a wrapper around this type:
public class TVShowContainer : INotifyPropertyChanged
{
private TVShow _tvShow;
public TVShow TvShow
{
get => _tvShow;
set
{
_tvShow = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
Now change the collection item type to this new "wrapper" type. Of course, you also have to update your GridView DataTemplate to have the right references. Instead of "{Binding Property}" you will now need to use "{Binding TvShow.Property}", or you can set the DataContext="{Binding TvShow}" attribute to the root element inside the DataTemplate.
But you may now see where I am going with this. Currently you are using Move method to move the items in the collection. Let's replace this with a swap:
var item1 = focusedItem.TvShow;
focusedItem.TvShow = LostItem.TvShow;
LostItem.TvShow = item1;
This is a big difference, because we no longer change the collection itself, but just move the references to items that are wrapped in a "static" container. And thanks to bindings the items will properly display where they should.
This is still a hacky solution, because it requires you to wrap your items just for the sake of the reordering, but it at least works. I am however still interested in finding a better way to do this.
I have created a content dialog for my UWP app which involves a centralized UI Element and a surrounding blank area.But content dialog does not have a property like "IsLightDismissEnabled" to close the dialog on click on an area except the UIELEMENT area.How can I achieve it?
In the code behind your content dialog:
public sealed partial class CustomDialog : ContentDialog
{
public CustomDialog()
{
this.InitializeComponent();
Boolean isHide;
Window.Current.CoreWindow.PointerPressed += (s, e) =>
{
if (isHide)
Hide();
};
PointerExited += (s, e) => isHide = true;
PointerEntered += (s, e) => isHide = false;
}
}
There are few options that I can think of:
Use popup (like uruk suggested) and add your controls inside, create the popup at desired location (you could also use binding here if you want to show the popup at location depending on user input at runtime Popup has HorizontalOffset and VerticalOffset properties)
Create a parent view that is taking up the whole page but is transparent, then add your UI elements at the center and attach tap/click events to the transparent view. These events are going to just close remove/collapse the transparent view which contains the other elements inside (Either by binding of values or by setting the values to the UI elements).
Example or popup usage:
<Popup x:Name="MenuPopUp"
IsLightDismissEnabled="True"
HorizontalOffset="{Binding HorizontalOffset}"
VerticalOffset="{Binding VerticalOffset}"
IsOpen="{Binding IsOpen, Mode=TwoWay}">
<Grid>
YOUR ELEMENTS HERE
</Grid>
</Popup>
Content dialog is a modal dialog. Why don't you use a Popup or a child class of it? It's non-modal, and it already has the IsLightDismissEnabled property you just mentioned.
<Popup x:Name="MenuPopUp"
IsLightDismissEnabled="True"
LostFocus="MenuPopUp_LostFocus"/>
In CS
private void MenuPopUp_LostFocus(object sender, RoutedEventArgs e)
{
MenuPopup.IsOpen = false;
}
I am working on a Compact Framework application. This particular hardware implementation has a touchscreen, but its Soft Input Panel has buttons that are simply too small to be useful. There are more than one form where typed input is required, so I created a form with buttons laid out like a keypad. The forms that use this "keypad" form are modal dialogs. When a dialog requiring this "keypad" loads, I load the "keypad" form as modeless:
private void CardInputForm_Load(object sender, EventArgs e)
{
...
keypadForm = new KeypadForm();
keypadForm.Owner = this;
keypadForm.SetCallback(keyHandler);
keypadForm.Show();
}
The SetCallback method tells the "keypad" form where to send the keystrokes (as a Delegate).
The problem I'm having is that the modeless "keypad" form does not take input. It is displayed as I expect, but I get a beep when I press any of its buttons, and its caption is grayed-out. It seems like the modal dialog is blocking it.
I've read other posts on this forum that says modal dialogs can create & use modeless dialogs. Can anyone shed light on this situation? Is there a problem with my implementation?
I found the answer: Set the keypad form's Parent property, not its Owner property, to the form instance wanting the keystrokes. The keypad dialog's title bar stays grayed out, but the form is active.
private void CardInputForm_Load(object sender, EventArgs e)
{
// (do other work)
keypadForm = new KeypadForm();
keypadForm.Parent = this;
keypadForm.Top = 190; // set as appropriate
keypadForm.Show();
}
Be sure to clean up when done with the parent form. This can be in the parent's Closing or Closed events.
private void CardInputForm_Closing(object sender, CancelEventArgs e)
{
// (do other work)
keypadForm.Close();
keypadForm.Dispose();
}
There are two panels on the keypad form, one with numerals and one with letters and punctuation that I want. There is also an area not on a panel that is common to both, containing buttons for clear, backspace, enter/OK, and cancel. Each panel has a button to hide itself and unhide its counterpart ('ABC', '123', for example). I have all the buttons for input on the keypadForm fire a common event. All it does is send the button instance to the parent. The parent is responsible for determining what action or keystroke is desired. In my case I named the buttons "btnA", "btnB", "btn0", "btn1", "btnCancel", etc. For keystrokes, the parent form takes the last character of the name to determine what key is desired. This is a bit messy but it works. Any form wishing to use the keypad form inherits from a base class, defining a method for callback.
public partial class TimeClockBase : Form
{
public TimeClockBase()
{
InitializeComponent();
}
// (other implementation-specific base class functionality)
public virtual void KeyCallback(Button button)
{
}
}
The click event on the keypad form looks like this.
private void btnKey_Click(object sender, EventArgs e)
{
// play click sound if supported
(Parent as TimeClockBase).KeyCallback(sender as Button);
}
The method in the parent form looks like this.
public override void KeyCallback(Button button)
{
switch (button.Name)
{
case "btnCancel":
// setting result will cause form to close
DialogResult = DialogResult.Cancel;
break;
case "btnClear":
txtCardID.Text = string.Empty;
break;
// (handle other cases)
}
}
I want to prevent the ability to deselect a list view item if it is already selected. Therefore how do I prevent right mouse click ability to deselect an item?
I have prevented the ability to deselect via swiping by using IsSwipeEnabled="False" on the List View. I didn't require swipe ability on the list view.
I'm happy to completely prevent right mouse click on the list view items if needed.
If I am reading your question correctly, it sounds like you want the ability for the user to select items, but to not be able to de-select. If that is the case, it seems like a strange requirement - it goes against normal UI convention and does something that the user is not expecting.
Having said that, you can do so by handling the SelectionChanged event in the ListView.
When the event is triggered, it gives you a list of removed (de-selected) items. You then just need to add those items back into the ListView's selected items list:
private void itemListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
foreach (var item in e.RemovedItems)
{
itemListView.SelectedItems.Add(item);
}
}
Note that if you use the above code, you do not have to handle any swipe or mouse events.
Edit - Per OP's comment, the requirement is slightly different than what I thought:
I want the selected item to deselect if a different item is selected. however what I dont want is an already selected item to be (manually) deselected
Assuming that you have a single select ListView, you can still use the SelectionChanged event and the SelectionChangedEventArgs to do what you are asking for:
private void itemListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (e.RemovedItems.Count > 0 && e.AddedItems.Count == 0)
{
var removed = e.RemovedItems[0];
itemListView.SelectedItem = removed;
}
}
I have found a simple solution on the following forum.
You simply add a RightTapped event to the ListView DataTemplate content.
<ListView>
<ListView.ItemTemplate>
<DataTemplate>
<ContentPresenter RightTapped="daves_RightTapped" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
And then in the code behind:
private void daves_RightTapped(object sender, Windows.UI.Xaml.Input.RightTappedRoutedEventArgs e)
{
e.Handled = true;
}
This works fine on an outlook style ListView.
Hopefully this is an easy one...
I need to create an "Alert Me" button on my custom SharePoint masterpage which when clicked, will direct the user to a pre-populated "New Alert" page for that particular site/list. The OOTB blog site template already features this exact same button at the bottom of the default.aspx page, it's markup is as follows:
http://server/currentsite/_layouts/SubNew.aspx?List={00000000-0000-0000-0000-000000000000}&Source=http://server/currentsite/default.aspx
Does anyone know if there is an OOTB control or web part that I can just drop into my page layout to reproduce this?
Obviously I could create the button dynamically in the codebehind of my page layout if need be, but I'd be surprised if there isn't a pre-written control already.
Thanks in advance...
For those insterested, I ended up rolling my own usercontrol for this. Code is as follows:
HTML
<asp:HyperLink ID="AlertHyperLink" runat="server"><img alt="Alert me" src="/_layouts/images/menualert.gif" title="Alert me to any changes that get made to this site." /></asp:HyperLink>
C#
protected void Page_PreRender(object sender, EventArgs e)
{
// If the current page is not associated with a list, then hide the list-sensitive tools.
if (SPContext.Current.List != null)
{
this.AlertHyperLink.NavigateUrl = string.Format(
"{0}/_layouts/SubNew.aspx?List={{{1}}}&Source={2}",
SPContext.Current.Web.Url,
SPContext.Current.List.ID.ToString(),
this.Server.UrlEncode(this.Page.Request.Url.ToString()));
}
else
{
this.AlertHyperLink.Visible = false;
}
}