Chuyển trang cơ bản trong Window Phone

Chào các bạn, đây là bài viết đầu tiên của mình về lập trình ứng dụng Windows Phone!!!

Chuyển trang

 

Ở bài viết này mình sẽ giới thiệu và chia sẻ cho các bạn 1 số kiến thức cũng như 1 số thao tác cơ bản trong việc chuyển trang trong ứng dụng Windows Phone

1. Chuyển trang cơ bản

 NavigationService là 1 lớp cung cấp các phương thức, thuộc tính, sự kiện để hỗ trợ Nagivate (điều hướng). NavigationService có thể điều hướng đến mọi đối tượng thuộc .NET Framework và cả tập tin HTML. Ở đây mình sẽ vận dụng lớp này để chuyển trang trong Windows Phone Application. 2 phương thức đáng nhớ ở đây chính là NavigatevàGoBack .

Phương thức Navigate nhận tham số là 1 URI là đường dẫn đến đối tượng mà mình muốn navigate đến. Còn GoBack sẽ giúp điều hướng trở về đối tượng gọi Navigate trước đó (đối tượng nguồn).

Ví dụ :

Khi tạo mới 1 Windows Phone Application thì bạn sẽ được trang giao diện là MainPage.xaml  và để thực hiện thao tác chuyển trang thì bạn phải có 1 Page khác. Mặc định thì MainPage.xaml sẽ được thực thi khi chạy ứng dụng .

–          Cách tạo thêm Page mới: bạn vào nhấp phải vào tên project của bạn trong Solution Explorer chọn Add / New Item . Trong cửa sổ Add New Item, bạn có thể chọn Windows Phone Portrait Page trong template Silverlight for Windows Phone, đặt tên theo ý muốn vào click vào Add.

Sau đây mình tạo 2 Page, Page có sẵn là MainPage.xaml và Page mới tạo là Page1.xamlTại mỗi Page mình tao 1 button và sửa lại PageTitle như sau:

Công việc đặt ra là khi click vào Button của trang này sẽ chuyển qua trang kia. Mình làm như sau: tạo kiện Click cho 2 Button.

Button bên MainPage.xaml có sự kiện click như sau:

        private void button1_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.Navigate(new Uri(“/Page1.xaml”,UriKind.Relative));

        }

Còn Button bên Page1.xaml thì có sự kiện click:

        private void button1_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.GoBack();

        }

Chạy thử và xem kết quả như thế nào nhé !

2. Chuyển trang có truyền dữ liệu bằng Query String

Bây giờ mình xét đến vấn đề chuyển đến trang khác nhưng có kèm theo dữ liệu. Ví dụ khi ở trang MainPage.xaml , người dùng sẽ nhập liệu vào để khi chuyển đến trang Page1.xaml sử dụng dữ liệu đó sẽ phải cài đặt như thế nào!! 1 trong các cách để truyển dữ liệu khi chuyển trang là dùng Query String như khi lập trình Web.

Và đối với truyền dữ liệu bằng QueryString, bạn cần quan tâm đến thuộc tính QueryString trong lớp NavigationContext. Lớp này có chức năng đặc tả các trạng thái (state) của hoạt động điều hướng. Thuộc tính QueryString  sẽ trả ra bộ giá trị Query string mà ta có thể dùng kiểu dữ liệu IDictionary để lưu trữ. Và mọi truy cập đến QueryString để lấy dữ liệu đều phải đặt trong phương thức OnNavigatedTo của trang được override.

Ví dụ:

Mình có 2 Page như mục 1.

Mainpage.xaml có thêm 1 TextBox và Page1.xaml có thêm 1 TextBlock:

Bây giờ yêu cầu đặt ra là khi hiện MainPage lên nhập dòng text vào TextBox rồi nhấn vào nút chuyển trang qua bên Page1, TextBlock sẽ hiển thị dòng text lúc nãy nhập trong TextBox bên Main Page.

Bắt đầu, mình code ở bên MainPage trước. Mình cũng sẽ cài đặt trong sự kiện click của Button như sau:

private void button1_Click(object sender, RoutedEventArgs e)

{

            NavigationService.Navigate(new Uri(“/Page1.xaml”+“?text=”+textBox1.Text,UriKind.Relative));

}

Ở đây mình đặt tên cho dữ liệu truyền là text. Đối số  UriKind.Relative để báo hiệu đây là đường dẫn tương đối.

Giả sử lúc này trong textBox1 ở MainPage, mình nhập vào là chuỗi “ABC” thì URI của mình sẽ như thế này:

 

/Page1.xaml?text=ABC

QueryString ở ứng dụng Windows Phone cũng tương tự như QueryString ở ứng dụng Web. Để có thể gởi nhiều đối số, bạn chỉ việc sử dụng kí tự &

Nhiệm vụ tiếp theo là cài đặt ở trang Page1.xaml.  Đó là mình định nghĩa lại phương thức OnNavigatedTo như sau:

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)

{   

    IDictionary<string, string> para = NavigationContext.QueryString;

if (para.ContainsKey(“text”))

        textBlock1.Text = para[“text”];

    base.OnNavigatedTo(e);

}

Đừng ngại vì phần tên phương thức, đối số dài và rắc rối, vì Visual Studio có hỗ trợ cho người lập trình rất nhiều. Với việc tích hợp Code Snippet, bạn chỉ cần gõ protected override , sau dấu cách, môi trường sẽ cho chọn công việc và tự sinh 1 số code.

Mình sẽ giải thích ngắn gọn đoạn code trong thân hàm như sau:

Đầu tiên khai báo 1 từ điển đặt tên là para để lưu bộ QueryString. Sau đó xét xem có tồn tại khóa tên text hay không? (vì lúc đầu ở bên MainPage mình sử dụng tên text trong QueryString). Nếu thỏa thì sẽ truy xuất đến nội dung có khóa là text trong từ điển para gán về cho nội dung của textBlock1.

 

Việc truyền dữ liệu còn có thể dùng các phương pháp khác. Có thời gian mình sẽ giới thiệu sau ^^