Как получить динамическое изображение в заголовке формы Xamarin?

Я работаю над формой Xamarin, в которой заголовок заголовка будет иметь температуру погоды и значок погоды с правой стороны.

Например

Нью-Йорк 60' F SunnyIcon

Я использую openweather API для получения данных.

Проблема в том, что я не могу создать держатель динамического изображения в заголовке формы Xamarin.

Как получить динамическое изображение в заголовке формы Xamarin?

Прикреплен пример приложения, над которым я работаю, на основе исходного кода, который я скачал с github...

введите здесь описание изображения


person goofyui    schedule 04.03.2017    source источник
comment
Что вы имеете в виду под заголовком? Панель навигации? Или что-то другое? Заголовок не имеет особого значения в XF.   -  person Jason    schedule 05.03.2017
comment
@jason, да, я упомянул о панели навигации.   -  person goofyui    schedule 06.03.2017
comment
@Jason, я прикрепил снимок экрана моего примера приложения .. на котором вы можете увидеть значок погоды в поле температуры .., мне нужно показать этот значок вместе с названием города, температурой, за которой следует значок   -  person goofyui    schedule 06.03.2017


Ответы (2)


Я не уверен, что вы подразумеваете под «Заголовком», но если вы пытаетесь добавить значок в Navigation Bar, вы можете сделать это, вызвав ToolbarItems.add() в конструкторе вашей страницы следующим образом:

    public myPage()
    {
        InitializeComponent();
        ToolbarItems.Add(new ToolbarItem("Weather", "WeatherIcon.png", async () =>
        {
            //Code to Execute when Icon is tapped
        }));
    }

При добавлении ToolbarItem первый параметр — это имя элемента, второй — имя изображения, которое будет отображаться в конце панели навигации, а последний параметр является необязательным и создает метод, который выполняется, когда значок нажат.

Если вам нужно, чтобы значок менялся в зависимости от текущей погоды, вы можете сделать это следующим образом:

    public myPage()
    {
        InitializeComponent();

        string weatherIconString = "";
        if(weather.isSunny) // Edit contition however you need
            weatherIconString = "SunnyIcon.png";
        else
            weatherIconString = "CloudyIcon.png";

        ToolbarItems.Add(new ToolbarItem("Weather", weatherIconString));
    }
person cvanbeek    schedule 05.03.2017
comment
Я упомянул заголовок, где мы упоминаем Page.Title. Мне нужно включить значок погоды вместе с Page.Title. Где у нас может быть значок со стрелкой назад или значок гамбургера ... Однако у меня нет проблем со статическими изображениями. У меня проблема только с динамическим изображением.. - person goofyui; 05.03.2017
comment
Заголовок, о котором вы упоминаете, - это панель навигации, если вы просто хотите добавить изображение, вы можете использовать этот код и удалить третий конструктор, поэтому при нажатии на него ничего не произойдет. - person cvanbeek; 05.03.2017
comment
Вы имеете в виду, что есть разные изображения, которые можно поместить в панель навигации? Если это так, вы можете написать операторы if, которые изменят значение изображения. Я отредактирую свой пост, чтобы показать это. - person cvanbeek; 05.03.2017
comment
это значок погоды .. от openweather .. openweathermap.org/weather-conditions — мне нужно отобразить это .. в зависимости от текущей погоды - person goofyui; 05.03.2017
comment
Xamarin Forms ToolbarItem не поддерживает значки из Uri. Чтобы использовать значки с openweathermap.org в проекте Xamarin Forms, нужно либо отображать значок на самой странице, а не в панели навигации, либо нужно скачать изображения и поместить их в соответствующий Project Папки изображений. Посетите страницу developer.xamarin.com/guides/xamarin-forms/user-interface/images/ для получения дополнительной информации. - person cvanbeek; 05.03.2017
comment
еще раз спасибо. На данный момент я загрузил открытые значки погоды и пытаюсь отобразить их на основе кода значка погоды. В конце концов, мы будем использовать наши собственные значки погоды для погоды. У меня возникли трудности с динамическим отображением загруженных значков погоды. - person goofyui; 06.03.2017

Вы должны написать собственный рендерер следующим образом: и результат: введите здесь описание изображения

 public class CustomNavigationPageRenderer : NavigationRenderer
{

    public override void ViewDidLoad()
    {
        //I'm getting width and height so i can rescale the image
        nfloat navigationBarWidth = NavigationBar.Frame.Width;
        nfloat navigationBarHeight = NavigationBar.Frame.Height;

        //you can load image from your bundle,so you can add your weather icons on bundle -> under Resources folder
        var img = UIImage.FromBundle("navigationbarbackground.jpg");
        //create image context to draw image
        UIGraphics.BeginImageContextWithOptions(new CGSize(navigationBarWidth, navigationBarHeight), true, 0);
        //I'm filling the background with a color so it is the same as with my background image color    
        UIColor.FromRGB(54, 60, 65).SetFill();
        UIGraphics.RectFill(new CGRect(0, 0, navigationBarWidth, navigationBarHeight));
        //draw your image according to the coordinates of the navigation bar, i put it to the right top with a small right padding,
        //you have to play with coordinates according to your needs
        img.Draw(new CGRect(navigationBarWidth - navigationBarHeight - 30,//move 30px to the left (do not paste to right border :))
            0, navigationBarHeight, navigationBarHeight));
        UIImage backgroundImage = UIGraphics.GetImageFromCurrentImageContext();
        UIGraphics.EndImageContext();
        NavigationBar.SetBackgroundImage(backgroundImage, UIBarMetrics.Default);

        //bonus :) change your title color
        UINavigationBar.Appearance.SetTitleTextAttributes(new UITextAttributes()
        {
            TextColor = UIColor.White,
        });

        base.ViewDidLoad();
    }
}
person Umut Bebek    schedule 15.03.2017