Xamarin Forms - Android Images Not Appearing - xamarin.forms

When I run my app on an iphone, all the images come up great. But when I tried running it on an android, none of the images showed up at all. The images were placed in both the ios and android folders (Android/Resources/drawable).
Anyone know why the images don't appear on an android?

I solved this exact problem by loading the images in the code behind.

The only way downloaded or filesystem retrieved images outside of the projects namespace work in Xamarin.Forms for Android is in the codebehind. Binding to the ImageSource will not display them. The problem has something to do with OnAppearing never setting or refreshing the property even if you set WidthRequest and HeightRequest. I'm actually not sure why but I have tested this process for a couple of weeks with no success. What I mean by this is the ViewModel is where you retrieve the image from a WebService or from the Filesystem then get and set your ImageSource this code typically will run on creation of the ViewModel or OnAppearing. There is a bug in the system with XAML so it will never work. Using the Codebehind and setting it directly is the only way the images will display. I don't know why this behaves this way but I have tested every conceivable way to do this and it does not work with ImageCircle or Image whether you set the ImageSource.FromFile or ImageSource.FromStream. It does work when you set the ImageSource in the XAMLs code behind using the Image object directly. If you read through this article on Images in Xamarin Forms it will explain which ways you can use XAML and display the the images using Embedded Resources and using.
https://developer.xamarin.com/guides/xamarin-forms/working-with/images/
<Image Source="{local:ImageResource WorkingWithImages.beach.jpg}" />
The only runtime ImageSource binding that seems to work is using a web address and pulling from the URI.
<Image Source="https://xamarin.com/content/images/pages/forms/example-app.png" />

Related

How to set image received from a web service as ImagePaint in Blackberry 10.1?

I am populating a QVariantMap with JSON data which I'm getting from a web service. This data contains, among other things, URL for images. Now I want to use these images as ImagePaint in my qml file, but in Blackberry OS 10.1, setting the imageSource to the URL doesn't load the image.
What is the way around this problem? Thanks.
You can use a WebView to display your image like the following:
Webview {
url: "link/to/your/image"
}

Why won't my Silverlight PivotViewer load?

I have a PivotViewer app I am working on, but, I cannot get it to run.
I have a good .cxml file (I used Pauthor to generate the related deep-zoom files). I have tried running it from inside VS 2010 int debug and even built it and tried running it from my localhost. I've checked it in both Firefox and IE. I've made sure it is in a container with set width and height. I've made sure I have the most current silverlight.js, I've set the appropriate MIMEs on IIS.
My XAML:
<UserControl x:Class="DomPivot.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:pivot="clr-namespace:System.Windows.Pivot;assembly=System.Windows.Pivot"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="400" Loaded="UserControl_Loaded">
<Grid x:Name="LayoutRoot" Background="White" Width="400" Height="400">
<pivot:PivotViewer x:Name="myPivot" Height="350"></pivot:PivotViewer>
</Grid>
</UserControl>
My error:
Error: Unhandled Error in Silverlight Application Set property 'System.Windows.FrameworkElement.Style' threw an exception. [Line: 11 Position: 52]
at System.Windows.Application.LoadComponent(Object component, Uri resourceLocator)
at DominionPivot.MainPage.InitializeComponent()
at DominionPivot.MainPage..ctor()
at DominionPivot.App.Application_Startup(Object sender, StartupEventArgs e)
at MS.Internal.CoreInvokeHandler.InvokeEventHandler(Int32 typeIndex, Delegate handlerDelegate, Object sender, Object args)
at MS.Internal.JoltHelper.FireEvent(IntPtr unmanagedObj, IntPtr unmanagedObjArgs, Int32 argsTypeIndex, Int32 actualArgsTypeIndex, String eventName)
Source File: DomPivotTestPage.aspx
Line: 0
Line 11 Position 52 of the main.xaml is now the equal sign for the Height property of the pivotviewer. Interesting that BEFORE I added the height property, the project threw this error at the equal sign for the x:Name property.
I don't understand why I'm getting this error and would appreciate some help. I've investigated the other topics here but none of those answers either worked or pertained to my situation.
UPDATE:
I've attempted to make sure it isn't some kind of other error cascading into an inability for the control to load by attempting to load a .CXML file from a public source. Same result. I don't think the control itself is loading, so, I can't even debug the code that loads the collection.
Googling "Unhandled Error in Silverlight Application Set property 'System.Windows.FrameworkElement.Style' threw an exception." is no help. It returns 24 hits. Half of those are unrelated. The other half is another person with what appears to be the same problem posting to half-dozen or more forums and getting no answer either.
OK....so here are a number of issues that a lot of frustrating googling and futzing revealed:
Loaded="UserControl_Loaded"
I'm not entirely sure how this parameter ended up in my UserControl tag, but, it is unnecessary and eliminated the error referenced in my question.
I also moved the LoadCollection method out of its own event and into the UserControl_Loaded event and got things to progress.
Next I found that if you are using Visual Studio to run the project, make sure you specify the port number both in your code and in your web project settings. These obviously need to be changed when you post to a live server.
Lastly, I was led to believe that you HAD to use either the freely available Pauthor tools or the Excel plug-in to transform your collection into a Deep Zoom. Which also requires futzing with IIS to allow .dzi and .dzc.
Not so. There is a freely available Microsoft Deep Zoom Composer tool. In that tool you can compose your deep zoom and export the collection. You'll end up with several xml files and image folders. I found that all you have to do is then reference the output_dzc.xml file in your collection.cxml as your ImgBase and make sure your IDs match between the two files. That's all.
I hope this saves someone the frustration I've experienced the last few weeks trying to use this awesome but pathetically under-documented control.
I would also recommend this blog entry:
http://indiandotnet.wordpress.com/2011/02/12/pivot-viewer-example-cricket-world-cup-2011/
It contains a link to a very simple pivotviewer VS 2010 solution file you can use to examine and familiarize yourself with file and directory structure as well as the necessary XML file structure and solution settings.

MVVM Light + Blend designer view error: Cannot find resource named 'Locator'.

The application runs fine but i could not see my design in the designer view.
It says Cannot find resource named 'Locator'. Obviously, i did not change anything in the code, i just did the data binding using the data binding dialog...
anyone facing the same problem?
There are two known occurrences where this can happen.
If you change to Blend before you built the application, the DLLs are not available yet and this error can be seen. Building the application solves the issue.
There is a bug in Expression Blend where, if you are placing a user control in another user control (or Window in WPF), and the inner user control uses a global resource, the global resource cannot be found. In that case you will get the error too.
Unfortunately I do not have a workaround for the second point, as it is a Blend bug. I hope we will see a resolution for that soon, but it seems to be still there in Blend 4.
What you can do is
Ignore the error when working on the outer user control. When you work on the inner user control, you should see the design time data fine (not very satisfying I know).
Use the d:DataContext to set the design time data context in Blend temporarily.
Hopefully this helps,
Laurent
I've come up with a reasonably acceptable workaround to this problem since it doesn't appear to have been fixed in Blend 4:
In the constructor for your XAML UserControl just add the resources it needs, provided you're in design mode within Blend. This may be just the Locator, or also Styles and Converters as appropriate.
public partial class OrdersControl : UserControl
{
public OrdersControl()
{
// MUST do this BEFORE InitializeComponent()
if (DesignerProperties.GetIsInDesignMode(this))
{
if (AppDomain.CurrentDomain.BaseDirectory.Contains("Blend 4"))
{
// load styles resources
ResourceDictionary rd = new ResourceDictionary();
rd.Source = new Uri(System.IO.Path.Combine(Environment.CurrentDirectory, "Resources/Styles.xaml"), UriKind.Absolute);
Resources.MergedDictionaries.Add(rd);
// load any other resources this control needs such as Converters
Resources.Add("booleanNOTConverter", new BooleanNOTConverter());
}
}
// initialize component
this.InitializeComponent();
}
There may be some edge cases, but its working OK for me in the simple cases where before I'd get a big red error symbol. I'd LOVE to see suggestions on how to better solve this problem, but this at least allows me to animate user controls that otherwise are appearing as errors.
You could also extract out the creation of resources to App.xaml.cs:
internal static void CreateStaticResourcesForDesigner(Control element)
{
if (AppDomain.CurrentDomain.BaseDirectory.Contains("Blend 4"))
{
// load styles resources
ResourceDictionary rd = new ResourceDictionary();
rd.Source = new Uri(System.IO.Path.Combine(Environment.CurrentDirectory, "Resources/Styles.xaml"), UriKind.Absolute);
element.Resources.MergedDictionaries.Add(rd);
// load any other resources this control needs
element.Resources.Add("booleanNOTConverter", new BooleanNOTConverter());
}
}
and then in the control do this BEFORE InitializeComponent():
// create local resources
if (DesignerProperties.GetIsInDesignMode(this))
{
App.CreateStaticResourcesForDesigner(this);
}
Note: At some point in time this stopped working for me and I ended up hardcoding the path to the Styles.xaml because I got frustrated trying to figure out which directory I was in.
rd.Source = new Uri(#"R:\TFS-PROJECTS\ProjectWPF\Resources\Styles.xaml", UriKind.Absolute);
I'm sure I could find the right path with 5 minutes work, but try this if you're at your wits end like I was!
In MyUserControl.xaml, instead of:
DataContext="{Binding Main, Source={StaticResource Locator}
use:
d:DataContext="{Binding Main, Source={StaticResource Locator}
where "d" has been previously defined as:
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
The reason and workaround explained here
http://blogs.msdn.com/b/unnir/archive/2009/03/31/blend-wpf-and-resource-references.aspx
Look at (b) part of the post.
I had a similar problem with a user control resource.
I added this in my usercontrol xaml code:
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/GinaControls;component/Resources/GinaControlsColors.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
Where GinaControls is the namespace where the control class is declared and /Resources/GinaControlsColors.xaml is the project folder and xaml resource file name.
Hope this helps.
Just add this in your App.xaml.cs at the very beginning
here's my piece of code
[STATThread()]
static void main(){
App.Current.Resources.Add("Locator", new yournamespace.ViewModel.ViewModelLocator());
}
public App(){
main();
}
Make sure the Blend has opened the entire solution and NOT just the single project containing the views. I was right-clicking in Visual Studio and selecting Open In Expression Blend. To my surprize, Blend could not find the solution file, so it only opened the single project.
When I realized this, I launched Blend directly, pointed it to the solution file, and then Blend was able to find the ViewModelLocator in my view.

Loading an external SWF App in a new Air window with resize functionality

i'm trying to load a local SWF Application in my Air Application via the SWFLoader class. The SWFLoader class is displayed in a new Window. Therefore, i'm trying to resize the window automatically, when the Flash Application is resizing. But here's the problem. The SWFLoader does not get any events when the loader App has been resized.
The Problem seems to be the Sandbox Restrictions. I'm able to call methods in the childSandboxBridge and parentSandboxBridge Objects that i've set in the LoaderInfo of the SWFLoaders content (the loaded SWF Application). But i cannot listen to any ResizeEvents or something like that when i'm resizing the loaded App.
I'm aware of the workaround with the Loader Class and the codeExecution Property, but i don't want to bypass the Air Sandbox - if possible.
Can anyone help me with this?
Thanks in advance
(Note: other security sandbox issues may be part of your problems. That said...)
IF your sandboxBridge is set and you can call methods though it as you mentioned, then you can dispatch and listen for events that bubble up through the swfLoader (and they do bubble through).
As a test I would try dispatching a test flash.events.Event with bubbles=true when your loaded swf captures its internal resizeEvent. (ResizeEvents, by default, do not bubble and could be the source of your issue).
I find this way, putting it in childSwf:
addEventListener(Event.ADDED,added)
function added(e){
if (root.parent.parent){
root.parent.parent.stage.addEventListener(Event.RESIZE, mainResizeHandler);
}
function mainResizeHandler(e:Event = null):void{
trace("width: "+stage.stageWidth+" | height"+stage.stageHeight);
}

Can I open a browser window to view an image created by a flex 3 application?

I have a flex 3 application that creates an Image from a canvas which the user draws on. I use the ImageSnapshot class to create the image
var imageSnap:ImageSnapshot=ImageSnapshot.captureImage(myCanvas);
var imageByteArray:ByteArray=imageSnap.data as ByteArray;
I want the user to be able to print or save the image. I can use the following code to print the image but flex does not provide good control over printing across multiple pages
var printJob:FlexPrintJob=new FlexPrintJob();
printJob.start();
printJob.addObject(myCanvas, FlexPrintJobScaleType.SHOW_ALL);
I would like to display the image in a browser window so that the user could print it using the built in browser functionality or right click on the image and save it. Can this be done without requesting server side code to do it?
I know that flash player 10 and flex 4 allow you to save files locally but for now I am stuck with player 9 and flex 3
You can still use the new features of FileReference (the save() and load() methods) in Flex 3 as long as the application is running in Flash Player 10. But if you are definitely stuck with Flash Player 9 then you will need to push the image up to the server first. If you are looking for a good way to push that data up to the server, please reference my solution in this question:
Flex: Render an unrealized UIComponent to BitmapData?
I don't believe you can do this, as it would violate the sandbox. For example, if this worked, it means you could put arbitrary code (analogous to an image) on the user's machine without their consent or knowledge.
I'm not sure if this will work, but try this:
Show a link to the image (file://path/to/image/img.ext) and set window.htmlLoader.navigateInSystemBrowser = true;

Resources