Forum Post: RE: windows 8 app buttons

coyote88 — Thu, 23 May 2013 17:30:00 GMT

Αυτό ακριβώς ήθελα!! Έχω σβήσει και από το Pressed το storyboard, γιατί και εκεί που έσβηνε στιγμιαία, την ώρα που πατούσα το κουμπί!! Απλά ενημερωτικά το λέω και για άλλους αν χρειαστεί. Ευχαριστώ πολύ για την γρήγορη απάντηση και τη λύση στο πρόβλημα αυτό!!

User: Fucoumwobby

Fucoumwobby — Thu, 23 May 2013 15:43:00 GMT

User: pevereertix

pevereertix — Thu, 23 May 2013 14:37:00 GMT

User: Mifyaffomma

Mifyaffomma — Thu, 23 May 2013 14:31:00 GMT

User: Feiufpifp

Feiufpifp — Thu, 23 May 2013 14:20:00 GMT

User: kQpZvZwKlR

kQpZvZwKlR — Thu, 23 May 2013 12:51:00 GMT

User: mumbt1heruha

mumbt1heruha — Thu, 23 May 2013 12:47:00 GMT

User: J0k3R-GR

J0k3R-GR — Thu, 23 May 2013 12:34:00 GMT

User: Argyris13

Argyris13 — Thu, 23 May 2013 12:32:00 GMT

User: Wheenurge

Wheenurge — Thu, 23 May 2013 12:05:00 GMT

User: beeavtv

beeavtv — Thu, 23 May 2013 11:31:00 GMT

User: EnconiEncouse

EnconiEncouse — Thu, 23 May 2013 11:02:00 GMT

User: sandrapiasta

sandrapiasta — Thu, 23 May 2013 10:54:00 GMT

Blog Post: NTUA XNA event

naimis20 — Thu, 23 May 2013 09:55:00 GMT

Καλησπέρα σε όλους,

ο κώδικας που γράψαμε για το παιχνίδι με τα διαστημόπλοια , βρίσκεται στο ακόλουθο url:

http://sdrv.ms/10SK4ke.

Επιπλέον , το url του online lab βρίσκεται στον ακόλουθο σύνδεσμο:

http://msdn.microsoft.com/en-us/windowsphonetrainingcourse_2dgamedevelopmentwithxnalab.aspx

User: BesiaSlishesk

BesiaSlishesk — Thu, 23 May 2013 09:10:00 GMT

User: porxif

porxif — Thu, 23 May 2013 07:49:00 GMT

Wiki Page: Β2. Different Size GridView

KwstasL — Thu, 23 May 2013 07:11:00 GMT

Σε αυτό το tutorial θα δούμε πως μπορούμε να φτιάξουμε ένα layout όπως είναι της εφαρμογής "Store" στα Windows 8.

Πάμε λοιπόν να δούμε πώς θα γίνει αυτό:

Προετοιμασία του Project:

1. Στο Visual Studio πατάμε: New Project -> Tempates -> Visual C# -> Windows Store -> Blank App (XAML)

2. Αφού δημιουργήσαμε το νέο project πηγαίνουμε στον Solution Explorer και στο φάκελο Common πατάμε δεξί click -> Add -> Class και δίνουμε όνομα MyGridView.cs.

3. Ανοίγουμε το αρχείο GridView.cs και κάνουμε paste τον παρακάτω κώδικα

public class MyGridView : GridView     {         protected override void PrepareContainerForItemOverride(Windows.UI.Xaml.DependencyObject element, object item)         {             try             {                 dynamic _Item = item;                 element.SetValue(Windows.UI.Xaml.Controls.VariableSizedWrapGrid.ColumnSpanProperty, _Item.ColSpan);                 element.SetValue(Windows.UI.Xaml.Controls.VariableSizedWrapGrid.RowSpanProperty, _Item.RowSpan);             }             catch             {                 element.SetValue(Windows.UI.Xaml.Controls.VariableSizedWrapGrid.ColumnSpanProperty, 1);                 element.SetValue(Windows.UI.Xaml.Controls.VariableSizedWrapGrid.RowSpanProperty, 1);             }             finally             {                 base.PrepareContainerForItemOverride(element, item);             }         }     }

(source: http://blog.jerrynixon.com/2012/08/windows-8-beauty-tip-using.html):

4. Ανοίγουμε το MainPage.xaml και στην αρχή προσθέτουμε τις 2 παρακάτω γραμμές:

xmlns:common="using:Different_Size_GridView.Common"

Δημιουργία του Different Size GridView

Στο MainPage.xaml γράφουμε τα εξής:

<Grid Background="#FFE8E8E8">         <!-- custom gridview (apo common - MyGridView.cs ) -->         <common:MyGridView x:Name="grid_view" Padding="116,137,40,60">

            <!-- edw orizoume to minimum mege8os ka8e stoixeiou tou gridview,  ka8ws kai oti to gridview 8a exei to polu 4 stoixeia(vash tou minimum mege8ous)  se ka8e grammh kai sthlh   -->             <GridView.ItemsPanel>                 <ItemsPanelTemplate>                     <VariableSizedWrapGrid ItemWidth="100" ItemHeight="100" MaximumRowsOrColumns="4"/>                 </ItemsPanelTemplate>             </GridView.ItemsPanel>

            <!-- orizoume pws ka8e stoixeio tou gridView 8a exei mia eikona -->             <GridView.ItemTemplate>                 <DataTemplate>                     <Image Source="{Binding image}" Stretch="UniformToFill"/>                 </DataTemplate>             </GridView.ItemTemplate>

        </common:MyGridView>     </Grid>

Στο MainPage.xaml.cs γράφουμε τα εξής:

using System; using System.Collections.Generic; using System.Collections.ObjectModel; using System.IO; using System.Linq; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation;  // The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238  namespace Different_Size_GridView {      public class Item     {         public string image { get; set; }         public int ColSpan { get; set; }         public int RowSpan { get; set; }     }      public sealed partial class MainPage : Page     {         public MainPage()         {             this.InitializeComponent();         }          protected override void OnNavigatedTo(NavigationEventArgs e)         {             // orizoume mia sullogh adikeimenwn tupou <Item>             ObservableCollection<Item> items = new ObservableCollection<Item>();              Item item;             // mesa se mia "for" dhmiourgoume tosa items osa kai ta stoixeia pou 8eloume na exei to gridView             for (int i = 0; i < 16; i++)             {                 // dhmiourgoume ena neo adikeimeno                 item = new Item();                  // vazoume to path ths photografias pou exoume sto project mas                 item.image = "Assets/" + i.ToString() + ".jpg";                  if (i == 0)                 {                     /* to adikeimeno auto 8a pianei to xwro pou 8a epianan kanonika 4 minimum adikeimena   sthn dikh mas periptwsh ws minimum exoume ta 100x100  4 grammes, 4 sthles -> 400 width, 400 height  */                     item.RowSpan = 4;                     item.ColSpan = 4;                 }                 else if (i == 5)                 {                     /*   2 grammes, 4 sthles -> 400 width, 200 height  */                     item.RowSpan = 2;                     item.ColSpan = 4;                 }                 else if (i == 8)                 {                     /*   2 grammes, 2 sthles -> 200 width, 200 height  */                     item.RowSpan = 2;                     item.ColSpan = 2;                 }                 else if (i == 15)                 {                     /*   4 grammes, 4 sthles -> 200 width, 400 height  */                     item.RowSpan = 4;                     item.ColSpan = 2;                 }                 else                 {                     /*   1 grammh, 1 sthlh -> 100 width, 100 height (minimum size)  */                     item.RowSpan = 1;                     item.ColSpan = 1;                 }                  // pros8ese sthn sullogh to adikeimeno                 items.Add(item);             }              // gemizoume to ItemSource tou gridView me thn sullogh mas             grid_view.ItemsSource = items;         }     } }

Όπως θα παρατηρήσετε το μόνο που έχουμε να κάνουμε είναι να ορίζουμε για κάθε στοιχείο του GridView το RowSpan, ColSpan (δηλαδή πόσες γραμμές και στήλες θέλουμε να πιάνει).

Κατεβάστε το DEMO

User: carpinteyrolke

carpinteyrolke — Thu, 23 May 2013 03:17:00 GMT

User: DepecheMode

DepecheMode — Thu, 23 May 2013 01:27:00 GMT

User: UnloaniniCrer

UnloaniniCrer — Thu, 23 May 2013 00:00:00 GMT

Site Root