As the title stated above, I want to create horizontal ListView in xamarin.forms.
But the solutions and the examples that I found are not the kind of horizontal list that I want.
Every articles that i stumbled upon, the items are arranged like this
item1____item2____item3____item4____item5
What I want to do is something like this
item1___item2
item3___item4
item5___and so on
in windows phone we can do it like this
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel ItemWidth="222" ItemHeight="100"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
Right now, is it possible to create something like this in xamarin.forms?
To my knowledge there is no such thing implemented directly in Xamarin Forms. But there is a FlowListView control from Daniel Luberda. Maybe this is what you want:
https://github.com/daniel-luberda/DLToolkit.Forms.Controls/tree/master/FlowListView/
Related
I'm new to app dev. I am now stuck in the design of my app. This item is an item like a bulletin board. Just do not know which way is the right way to design my data in this style below? I had no idea whether to use the DATAGRIDVIEW OR LISTVIEW/LISTBOX?
Hope to get some idea from you guys
As Nex said, you are better off making the design shown in your picture as a usercontrol and after you do that use a ListView with a data template like this:
<ListView x:Name="mylistview">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
//a Panel container (i.e stackpanel, wrappanel)
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
//Your usercontrol
</DataTemplate>
</ListView.ItemTemplate>
and of course you will need to use data binding to show your data.
on Windows 8.1 below code indicates the selected item of GridView. But on Windows Phone Xaml same code doesn't work like that. There isn't any visual indicator for selected item at all.(or i couldn't get it to work) How can i make it work like this on Windows Phone App too?
<GridView
x:Name="productColorChoices"
SelectionMode="Single"
ItemTemplate="{StaticResource productColorChoice_ItemTemplate}">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid
Orientation="Horizontal" />
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
If you go look at the GridViewItem default style template you'll see towards the bottom you have these objects in there;
SelectedBorder
SelectedCheckMarkOuter
SelectedCheckMark
SelectedEarmark
Which is what makes up the visuals for that selected outline/checkmark thingy on the GridView items. They all get shown according to the VisualState for Selected
Now, if you go and look at the phone's default style template for the GridViewItem's (which I couldn't find the default one for with a quick google search and I don't have a phone project open to go dig through) then you can compare. If these types of elements don't exist in the phone templates then you can go add them the same way using pretty much the same objects and the same storyboards in the same VisualState.
Hope this helps, cheers.
I'm trying to use in my application an input-selected index to scroll a ListBox (horizontally scrollable). I've found on MSDN and on this own site the method ScrollIntoView but it doesn't work and on the ListBox Class page it has been written to be compatible with WP 7.0, 7.1. So, this is a snapshot of my code...
scrolling.ScrollIntoView(scrolling.Items[20]);
where scrolling is my ListBox and the 20th item is the one I want to be selected and visualized.
PS: I've already tried to use the selectedIndex way but it is still not working!
This is a xaml of my ListBox (put in the Layout Grid) which have referencies to templates written in the App.xaml document.
<ListBox x:Name="scrolling" Grid.Column="0" ScrollViewer.ManipulationMode ="Control" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Visible">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
edit: I found that calling the function by a button makes the all whole stuff work, but how to initialize everything at the start?
I used in my solution first updated UI and then called ScrollIntoView it works fine:
scrolling.UpdateLayout();
scrolling.ScrollIntoView(scrolling.Items[20]);
I'm building a wpf metro style application, but for the start, page I needed to create Windows 8 start screen like listbox in windows 7 and .NetFramework 4.0.
I used Listbox and Wrappanel now, but as you see it's not clear!!!
Please help me to fill the blank cell.
EDIT
change place of buttons
look at :
http://www.codeproject.com/Articles/370650/Simple-Metro-Style-Panorama-Control-for-WPF
by Sacha Barber
this is not trivial at all... even microsoft guys told me that on a recent training I had..
I recommend following the following article which has something very close to what you need!
http://tozon.info/blog/post/2012/09/01/Variable-sized-grid-items-in-Windows-8-apps.aspx
Hope it helps!
VariableSizeWrapGrid does the trick :
<GridView>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizeWrapGrid ItemHeight="100" ItemWidth="150"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
Example of result :
Use a WrapPanel for layout and you're done:
<ListBox>
...
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
Hi all i need to design a control that has a thumbnail views of picture.it can take list of pictures.i need it in wpf.is there any pre existed library of control?
if no how can i design i have no idea
Thanks
was looking something like http://www.codeproject.com/KB/graphics/crystal_image_grid_viewer.aspx?msg=3290254
If you have a list of pictures you can place a panel (StackPanel, WrapPanel, etc., depends on the behaviour you want) inside a ListBox. Set the panel to be the items host, and set the list of pictures as the ItemsSource. Something like this:
<ListBox x:Name="_listBox" >
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal" IsItemsHost="true" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
and then in the code behind set _listBox.ItemsSource to your list of pictures.
(or you can have your list of pictures in an ObservableCollection and bind the ListBox to it)
EDIT: as for the thumbnails you can use something like:
BitmapImage Picture = new BitmapImage();
Picture.BeginInit();
Picture.UriSource = ... // your picture
Picture.DecodePixelWidth = ... //how big you want your pic
Picture.EndInit();
do you want to show all the images of the list at the same time? I believe you can use the grid and put a picture control in any cell of the grid, you can start with this approach, post your results and ask more specific questions once you have it at least partly done.