Как сделать шаблон страницы, который можно инициализировать в коде C # главной страницы?

Question

Я хочу создать шаблон страницы в моем проекте UWP, который можно инициализировать на главной странице в коде C #.

Например, страница похожа на введение в рисование: рисование картины (может быть URL, представляющим изображение), введение текста ниже. И мне нужно инициализировать эти два элемента на главной странице и динамически создать новую страницу в коде C #. Потому что для каждой покрасочной работы мне нужно использовать новую страницу для навигации и отслеживания.

Как это сделать? Спасибо!

Answer 1

Я хочу создать шаблон страницы в моем проекте UWP, который можно инициализировать на главной странице в коде C #.

По вашему требованию вы можете создать ImagePage, который содержит класс ImageModel, как показано ниже. При переходе страницы к изображению и текстовой метке будет инициализирован параметр, исходящий от главной страницы.

Xaml

 <StackPanel>
     <Image Name="MyImage"/>
     <TextBlock Name="MyDescription"/>
 </StackPanel>

Код позади

public sealed partial class ImagePage : Page
{
    public ImagePage()
    {
        this.InitializeComponent();
    }

    public class ImageModel
    {
        public string ImageUrl { get; set; }
        public string Description { get; set; }
    }
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        if (e.Parameter != null && e.Parameter is ImageModel)
        {
            var data = e.Parameter as ImageModel;
            MyImage.Source = new BitmapImage(new Uri(data.ImageUrl));
            MyDescription.Text = data.Description;
        }
    }

}

Затем добавьте кадр, который используется для навигации на главной странице.

<Grid>
  <Frame Name="ImageFrame"/>
</Grid>

Использование

public MainPage()
{
  this.InitializeComponent();
  var TestData=new ImageModel
  { 
    ImageUrl = "https://via.placeholder.com/150", 
    Description = "This is a test image"
  }

  ImageFrame.Navigate( typeof(ImagePage), TestData );
}

Теперь, когда вы запустите приложение, ваша новая страница изображения будет загружена во фрейм.

Это краткий пример, основная цель которого - показать, как перейти на страницу и задать параметры для страницы.

Когда страница получает параметр, вы можете настроить интерфейс в соответствии с параметром.

Таким образом, вы можете использовать GridView для отображения всех изображений. Когда вы нажимаете на одну из них, используйте этот принцип, чтобы перейти на предварительно созданную страницу.

Надеюсь, это поможет вам.