Posts

Showing posts from 2015

Debugging HTML5 running in iOS from Windows with Chrome dev tools!

Image
In order to debug HTML5 running in Safari on iOS, I used to connect the iOS device to my Mac, open Safari, go to Developer menu(needs to be activated from Safari Preferences) and open the page. You can find detailed steps how to do this on internet. I tried to remote debug HTML5 with other tools (Telerik has one), but the best way is with an utility called  ios-webkit-debug-proxy  which uses Chrome dev tools! You can find it here  https://github.com/google/ios-webkit-debug-proxy  and its Windows port: https://github.com/artygus/ios-webkit-debug-proxy-win32 It allows you inspect the WebKit (either the Safari or UIWebViews) running on the iOS device from your Windows machine with Chrome dev tools. This utility connects to the WebKit for inspection. Steps (most of these are written in https://github.com/google/ios-webkit-debug-proxy ): Go to  https://github.com/artygus/ios-webkit-debug-proxy-win32 You can either get the compiled version or build from the source. I chose to built it from s

GridSplitter control for Xamarin Forms

Image
I created a GridSplitter control for Xamarin Forms, which works on iOS and Android. You can find the full description of how it works and how to include it in your app: https://github.com/andreinitescu/GridSplitterApp Here are some screenshots of the demo app: and a Grid with both horizontal and vertical splitters: The sample app also shows a technique to create reusable custom controls which you can style easily, very similar to how it works in WPF/UWP.

Easiest way to know which w3wp.exe PID corresponds to which application pool

Image
I keep forgetting this. Open Task Manager and have it show the Command Line column You can see for the w3p.exe processes the name of the app pool in the command line parameters

Xamarin Forms style resets

There are some default styles which you might want to reset in your Xamarin Forms apps. For example, some container controls have default padding and spacing for their child views. In a more complicated UI, sometimes these default styles can become an issue. Because the UI you build is complex, you can forget about these default values and you wonder why some views are not positioned the way you want. I created a small XAML 'resets' snippet, which can be added to the App.xaml: https://gist.github.com/andreinitescu/69e8afcad1ed9de69b76

Add App.xaml in your Xamarin Forms project

In the current version of Xamarin tools, the default Xamarin Forms project templates in both Visual Studio and Xamarin Studio do not generate App.xaml along with the App class that derives from Application and provides an entry point where you can add initialization code.  The support for App.xaml is briefly mentioned in Xamarin Forms documentation  but without giving the exact steps. These steps are: 1. Right click on the PCL project and choose to add a new file 2. In Visual Studio, choose the "Forms Xaml Page" item     In Xamarin Studio, choose the "Forms ContentPage Xaml" item 3. Write "App" as name You will get a App.xaml and App.xaml.cs created. You need to do some small modifications in each of these: 1. in App.xaml, replace the XAML with the following: < Application xmlns = "http://xamarin.com/schemas/2014/forms" xmlns:x = "http://schemas.microsoft.com/winfx/2009/xaml" x: Class = "MyApp.App" > <

IconView control for Xamarin Forms

Image
Someone was asking on the forum how to draw a colored icon. I created an IconView control which does this: https://github.com/andreinitescu/IconApp/ The control takes a local image and applies a color on it. This is useful when you want to color images on the fly, without the need to have multiple images for different colors. At this moment the implementation is for Android and iOS. Contributions for Windows support are welcome! Usage An example of a Page using the IconView control: <? xml version = " 1.0 " encoding = " UTF-8 " ?> < ContentPage xmlns = " http://xamarin.com/schemas/2014/forms " xmlns:x = " http://schemas.microsoft.com/winfx/2009/xaml " x:Class = " IconApp.MyPage " xmlns:controls = " clr-namespace:IconApp;assembly=IconApp " > < controls:IconView Source = " monkey " Foreground = " Red " WidthRe

CallDataMethod trigger in Xamarin Forms

Here’s a very simple implementation of a CallDataMethod trigger in Xamarin Forms: public class CallDataMethod: TriggerAction < VisualElement > { public string Method { get ; set ; } #region implemented abstract members of TriggerAction protected override void Invoke (VisualElement sender) { MethodInfo method = sender.GetType ().GetRuntimeMethod (Method, new Type[ 0 ]); if (method != null ) { ParameterInfo[] parameters = method.GetParameters (); if (parameters.Length == 0 ) method.Invoke (sender, null ); } } #endregion } For a demo, let’s say we have two text-boxes (Entry control in Xamarin Forms) and you want to enable the second one when the first has ten characters: <? xml version = " 1.0 " encoding = " UTF-8 " ?> < ContentPage xmlns = " http://xamarin.com/schemas/2014/forms &quo

Manually install Xamarin Studio addins

Just copy the .dll file to (note the Xamarin Studio version, it might be different today): on Windows : %LocalAppData%\XamarinStudio-5.0\LocalInstall\Addins on Mac : /Users/[YourUser]/Library/Application Support/XamarinStudio-5.0/LocalInstall/Addins Source: http://forums.xamarin.com/discussion/comment/6356/#Comment_6356

Add ImageFailed and ImageOpened to the Xamarin Forms Image control

Currently the Image control in Xamarin Forms does not have an event to handle when image could or couldn't open. I created a way to do this by extending the implementation for the Image control and ImageSource. Check out the source code and a demo app on my GitHub: https://github.com/nitescua/ImageExtensionsApp I implemented two ways to handle image loaded status. You could either:  1. Use the Image derived class ImageEx which exposes ImageOpened and ImageFailed events: < controls:ImageEx Source = " http://dummyimage.com/100x100/000/fff " ImageFailed = " Image_ImageFailed " ImageOpened = " Image_ImageOpened " /> 2. Handle the status change right on the ImageSource instance: ImageSourceExtensions.SetStatusChangedHandler (MyImage.Source, (sender, status) => { Debug.WriteLine( " Image status: {0} " , status); }); where MyImage is an Image control in your Page To add the implementation in your apps, you need to: 1. Add ImageSour

Cross platform splash screen in Xamarin Forms

If the splash screen is more than just an image, you can treat the splash screen as a Xamarin Page. To make this there are some steps: Step 1 . set the App’s MainPage to the splash screen page: public partial class App : Application { public App() { InitializeComponent(); Setup.Init(); // with XLabs, you would do (Page)ViewFactory.CreatePage<SplashViewModel>(); MainPage = new SplashPage(); } Step 2 .  In SplashPage, after some logic is done, you will need to “navigate” to your first app’s page. This means you just need to set again the App’s MainPage, i.e”: void ShowMainPage() { MainPage = new SplashPage(); } The issue is how do you call this. If you are not doing any logic in the splash screen, you can just do something like this: public class SplashPage : Page { async protected override void OnAppearing() { ba