Xamarin.Forms页面跳转及list初次使用

 

1、新建Xamarin.Forms项目

2、修改App.xaml.cs文件

public partial class App : Application
    {
        public static string FolderPath { get; private set; }
        public App()
        {
            InitializeComponent();
            FolderPath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData));
            MainPage = new NavigationPage(new NotesPage());
        }

        protected override void OnStart()
        {
            // Handle when your app starts
        }

        protected override void OnSleep()
        {
            // Handle when your app sleeps
        }

        protected override void OnResume()
        {
            // Handle when your app resumes
        }
    }

注意：MainPage = new NavigationPage(new NotesPage());这条代码定义了项目启动页面。如果此时生成会报错，因为NotesPage这个页面还没有创建。

NavigationPage的作用就是导航管理页面。带个顶部导航如下图所示。

3、创建NotesPage页面

修改NotesPage.xaml

 <ListView.ItemTemplate>  
            <DataTemplate>
                <TextCell Text="{Binding Text}"
                          Detail="{Binding Date}" />
            </DataTemplate>
        </ListView.ItemTemplate>

模型数据绑定

 注意： x:Class="App2.NotesPage" App2为项目名称

修改NotesPage.xaml.cs

public partial class NotesPage : ContentPage
	{
		public NotesPage ()
		{
			InitializeComponent ();
		}

        protected override void OnAppearing()
        {
            base.OnAppearing();

            var notes = new List<Note>();

            var files = Directory.EnumerateFiles(App.FolderPath, "*.notes.txt");
            foreach (var filename in files)
            {
                notes.Add(new Note
                {
                    Filename = filename,
                    Text = File.ReadAllText(filename),
                    Date = File.GetCreationTime(filename)
                });
            }
            //listView添加数据源
            listView.ItemsSource = notes
                .OrderBy(d => d.Date)
                .ToList();
        }
        /// <summary>
        /// +好跳转,并在新页面创建Note对象
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        async void OnNoteAddedClicked(object sender, EventArgs e)
        {
            await Navigation.PushAsync(new NoteEntryPage
            {
                BindingContext = new Note()
            });
        }
        /// <summary>
        /// 点击具体内容跳转，将模型传到新页面
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        async void OnListViewItemSelected(object sender, SelectedItemChangedEventArgs e)
        {
            if (e.SelectedItem != null)
            {
                await Navigation.PushAsync(new NoteEntryPage
                {
                    BindingContext = e.SelectedItem as Note
                });
            }
        }

    }

4、创建NoteEntryPage页面 

修改NoteEntryPage.xaml文件 

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="App2.NoteEntryPage"
             Title="Note Entry">
    <StackLayout Margin="20">
        <Editor Placeholder="Enter your note"
                Text="{Binding Text}"
                HeightRequest="100" />
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Button Text="Save"
                    Clicked="OnSaveButtonClicked" />
            <Button Grid.Column="1"
                    Text="Delete"
                    Clicked="OnDeleteButtonClicked"/>
        </Grid>
    </StackLayout>
</ContentPage>

 修改NoteEntryPage.xaml.cs文件

public partial class NoteEntryPage : ContentPage
	{
		public NoteEntryPage ()
		{
			InitializeComponent ();
		}

        async void OnSaveButtonClicked(object sender, EventArgs e)
        {
            //模型绑定
            var note = (Note)BindingContext;

            if (string.IsNullOrWhiteSpace(note.Filename))
            {
                // Save
                var filename = Path.Combine(App.FolderPath, $"{Path.GetRandomFileName()}.notes.txt");
                File.WriteAllText(filename, note.Text);
            }
            else
            {
                // Update
                File.WriteAllText(note.Filename, note.Text);
            }

            await Navigation.PopAsync();
        }

        async void OnDeleteButtonClicked(object sender, EventArgs e)
        {
            var note = (Note)BindingContext;

            if (File.Exists(note.Filename))
            {
                File.Delete(note.Filename);
            }

            await Navigation.PopAsync();
        }
    }

5、生成项目

本项目是按官方文档踩坑而来，我把顺序调整了下。Xamarin.Forms相比xamarin.android做页面舒服很多。