i'm totaly newbie with xamarin. Iknow whats is XAML file, and AXML . But i don't understood on this project ( New/ Cross plat. / Android )
The files XAML or AXML.
I have : APP.XAML and MainPage.XAML but also in layout Tabbar.axml and toolbar.axml
Running the app, the main page displays the label
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:App1"
x:Class="App1.MainPage">
**<Label Text="APP TEST HUB" **
VerticalOptions="Center"
HorizontalOptions="Center" />
But i can't acess the toolbox to designer. Openning the layout Tabbar.axml and toolbar.axml files i can acess the toolbox and work in design, but running the app this files isn't appears.
Can anyone tell me the difference of the files and his importance to the project . Where i'll work my design ?
XAML files are used by Xamarin Forms projects. AXML files are used by Xamarin Android (and native Android) projects.
You appear to have created a Xamarin Forms project. Typically you would do this if you wanted to create an app that ran on multiple platforms (iOS, Android, etc). In Xamarin Forms projects, the platform project (Android in your case) is primarily used to bootstrap the Forms code that lives in the shared project. Most of the UI actually is defined in the shared project via XAML files.
In addition to Jason's answer, XAML uses the basic native UI of what to be shown to each platform, if you wanted to have an extensive/heavy UI, you have to use a CustomRenderer in order for it to be applied in your XAML code.
why xamrin layout use axml file but xamarin form user xaml?
AXML and XAML are two different XML specs.
AXML is used to define native ui in Xamarin.Android based on XML spec:
xml.com/axml/axml.html
AXML Is just supported/available for Xamarin.Android.
XAML is the way Xamarin Forms could standardize Cross Platform UI
based on XML spec
https://msdn.microsoft.com/en-us/library/cc295302.aspx
If you are using native Xamarin Android you will do UI using axml if
using Forms then using XAML.
Related
In Android, it is quite easy to set a image placeholder for development purposes in an imageview.
All one would do is use the tools:src for the placeholder image during development so you could see it in your layout design preview and your actual image you would put into your android:src
. Frequently, you don't set the android:src put would populate that imageview with images that you download off the internet once you connect your app to the net:
<ImageView
android:layout_width="28dp"
android:layout_height="28dp"
android:src=#drawable/activated_icon"
tools:src="#mipmap/white_activated_icon" />
In Xamarin, you have this to display images:
<Image Source="http://lorempixel.com/1920/1080/nature/3" />
Once the app connects, the image is downloaded from the internet and displayed. How do I put in a placeholder image for development purposes (similar to the way you would do it through tools:src in android) so I can see it within the layout design previews?
I'm assuming you want to achieve this with Xamarin Forms, as you referring to XAML in the question title.
Or possibly you are referring to the Xamarin Forms Previewer? In that case, disregard the following answer. You can only use local images in the Previewer as far as I can tell.
Answer in case the question is related to runtime Xamarin Forms
There is no standard option to do this in Xamarin Forms. Take a look at this example suggested by Stephane Delcroix from the Xamarin Forums. The important part of this approach is to stack 2 images on top of each other in a grid. 1 is the placeholder that is placed beneath the image that is being loaded, like this:
var grid = new Grid();
grid.RowDefinitions.Add (new RowDefinition());
grid.Children.Add (image);
grid.Children.Add (placeholderImage);
As an alternative option, WebImage of Xamarin Forms Labs allows an option for a DefaultImage, but I'm not sure if that shows immediately. See this class for the code of the Web Image. Keep in mind that Xamarin Forms Labs is no longer under active maintenance.
Of course you can also write a custom renderer. Maybe based on the Xamarin Forms Labs example.
I use FFImageLoading for this Case.
Just install the Nuget Package and Use the "CachedImage" in XAML.
<ff:CachedImage Source="your url" Placeholder="placeholder while loading"/>
You don´t need to download (and cache) the Image manually then. It will automatically displayed when the download is done.
You can use local files (from Resources or Drawable) and files from HTTP/HTTPS.
I would like to modify the design of the chrome and top menu panel of my app where the close and minify icons are.
How do I do this and in what XAML file? Should it be done in App.xaml, or in my main page's xaml file? I can find instructions on how to do this in a WPF app, but the concepts don't seem to carry over to Univeral App XAML.
As far as I know, you can change some settings from the chrome bar in the uwp, but not fully customize it by default.
The starting point for doing so would be the ApplicationView's TitleBar property.
This allows you to change the colors of the buttons and the bar itself:
var titleBar = ApplicationView.GetForCurrentView().TitleBar;
if (titleBar != null)
{
titleBar.ButtonBackgroundColor = Colors.DarkBlue;
titleBar.ButtonForegroundColor = Colors.White;
titleBar.BackgroundColor = Colors.Blue;
titleBar.ForegroundColor = Colors.White;
}
It is worth mentioning that when running the application on a PC, the control is called TitleBar but on a mobile device, it is called StatusBar. Full example for handling both devices can be found here.
If you need more personalization options, creating your own TitleBar component should be possible, look for the ExtendViewIntoTitleBar property of the CoreApplicationViewTitleBar object.
More info can be found here.
You need to use a resource dictionary with the custom styles. You can import these themes via App.Xaml to apply it.
These links might be of help. If you have any specific questions feel free to ask.
ResourceDictionary and XAML resource references
XAML theme resources
I'm new to Appcelerator Titanium, so one of the considerations that popped into my mind was this: how do I create reusable custom controls for use in Alloy? Take for example in Android:
The ColorPicker is a 3rd-party library that allows me to add it as a control to the .xml file so long as I reference the library. I would also be able to create my own controls and either reuse them locally or distribute them as an external library. Is there a similar concept for Titanium, more specifically for Alloy (i.e. the xml and all)?
Yes there is the concept of creating widgets and which can be reused locally in the projects. There are alot of widgets already available.
One of the important widgets for creation of the application Font Awsome Widget.
You can see the source code as well and check its implementation.
I am hesitant to develop a Windows Phone app in the HTML/WinJS Universal App space because of the difficulty of building complex user controls. Before I go the XAML/C# route, I would like to find out if it is possible to use a user control built in XAML/C# inside of an HTML/WinJS view?
My initial feeling is that it is not possible due to XAML parsing not being available in the HTML space, but I am not certain that this is the case. Any thoughts?
Also, I am not interested in 3rd party solutions such as Xamerin. I am really trying to see if this is possible from a native approach.
No. The HTML and Xaml UI stacks in the Windows Runtime are separate and cannot be mixed. You can call non-UI C# or native Windows Runtime Components from JavaScript.
You can include HTML in a Xaml WebView, but there is no reverse hosting.
--Rob
I'm trying out the mobile pattern, and have been trying to crate my own custom pattern that is now supposedly supported in Worklight 6.1.
When I tried creating jquery UI pattern, several issues:
1. The rich page editor for the pattern.html does not display the jquery component correctly on the design page (e.g button is displayed as link).
2. When I added a new page (into a jquery hybrid app) based on the custom UI pattern, it does not create a new page. It only adds the content code into the index.html, and I had to create the page myself.
Is this the correct behaviour?
I'm also having difficulty in creating Dojo UI pattern… as there is no Dojo component available on the palette when I open up the dojo > pattern.html file.
Do I have to add the libraries and code manually (i.e. no Drag-and-Drop)?
Appreciate any pointers on this.
PS: I'm using Eclipse Juno R2
1) For jQuery based patterns you need to append a jQuery core file to the project besides the jQuery mobile ones, for example, append this one: http://code.jquery.com/jquery-1.10.2.js to your project, next to jquery mobile JS file. This is just because "UI Pattern" projects don't have this file available, but they need it to handle a proper preview.
2) For Dojo patterns, there is still no official support (for example Drag and drop), so even you can modify pattern.html to get some "insertable" code, you may still need some additional tuning to get a valid pattern.