Posts Tagged ‘Xamarin Forms’

I ran into this issue this week. I would define the Source as a URL and then, nothing…

It turns out, with FFImageLoading, an indispensable Xamarin.Forms plugin available via NuGet, you must also set the ErrorPlaceholder property if loading your image from a URL. That did the trick – images started loading perfectly!

I’ve reported what I think is a bug. I haven’t yet looked at their code.

Here’s an example of how I fixed it:

Working Code:

<ff:CachedImage 
    Source="{Binding ModelImageUrl}"
    ErrorPlaceholder="icon_errorloadingimage"
    DownsampleToViewSize="True"
    RetryCount="3"
    RetryDelay="1000"
    WidthRequest="320"
    HeightRequest="240"
    Aspect="AspectFit"
    HorizontalOptions="Center" 
    VerticalOptions="Center" />

Non-Working Code, note the missing ErrorPlaceholder property:

<ff:CachedImage 
    Source="{Binding ModelImageUrl}"
    DownsampleToViewSize="True"
    RetryCount="3"
    RetryDelay="1000"
    WidthRequest="320"
    HeightRequest="240"
    Aspect="AspectFit"
    HorizontalOptions="Center" 
    VerticalOptions="Center" />

I hope that helps others with the same issue. Enjoy!

I had the need today to display strikethrough text in a Xamarin Forms app. The built-in label control didn’t support such formatting. So, leaning on Unicode’s strikethrough character set, I wrote a function to convert any string to a strikethrough string. To be fair, this works great for the normal character set, so I feel it’s good for most things. Please let me know if your mileage varies.

Business case: I needed to show a “Was some dollar amount” value. Like “Was $BLAH, and Now BLAH!”

In my class, I simply called into my strikethrough converter, as follows:

The property:

public string StrikeThroughValueText => StrikeThroughValue.HasValue ? $"{ConvertToStrikethrough(StrikeThroughValue.Value.ToString("C"))}" : "???";

The function:

private string ConvertToStrikethrough(string stringToChange)
{
    var newString = "";
    foreach (var character in stringToChange)
    {
        newString += $"{character}\u0336";
    }
 
    return newString;
}

Enjoy! I hope this helps you 🙂

Link: More about why this works: Combining Long Stroke Overlay.

I ran into this issue today when debugging on Android, so posting what took an hour to figure out 🙂 This is for when you’re getting a null reference exception when attempting to scan. I was following the instructions here, and then, well, it wouldn’t work 🙂

Rather than using the Dependency Resolver, you’ll need to pass in the Application Context from Android. So, in the App, create a static reference to the IQrCodeScanner,, as follows:

	public partial class App : Application
	{
 
	    public static IQrCodeScanningService QrCodeScanningService;

Then, populate that static instance from the Android app, as follows:

App.QrCodeScanningService = new QrCodeScanningService(this);
global::Xamarin.Forms.Forms.Init(this, bundle);
LoadApplication(new App());

Obviously you’ll also need a matching constructor, like so:

public class QrCodeScanningService : IQrCodeScanningService
{
    private readonly Context _context;
 
    public QrCodeScanningService(Context context)
    {
        _context = context;
    }

This solved the problem like magic for me. I hope it helps you, too!

P.S. Make sure you have the CAMERA permission. I’ve also read you may also need the FLASHLIGHT permission, although I’m not entirely sure that’s required.

So I had to deal with this recently. There were many examples out there, many of which didn’t work. Sooo, I’m blogging my code example so others don’t remain stuck 🙂

In short:

  1. In the XAML, add a CommandParameter binding, and wire up the Clicked event handler.
  2. In the C# Event Handler: Read the (sender as Button).CommandParameter and it’ll be the bound object. Cast / parse accordingly.

XAML (condensed):

<ListView x:Name=”LocationsListView”
ItemsSource=”{Binding Items}”
VerticalOptions=”FillAndExpand”
HasUnevenRows=”true”
RefreshCommand=”{Binding LoadLocationsCommand}”
IsPullToRefreshEnabled=”true”
IsRefreshing=”{Binding IsBusy, Mode=OneWay}”
Refreshing=”LocationsListView_OnRefreshing”
CachingStrategy=”RecycleElement”>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation=”Horizontal” Padding=”5″>
<StackLayout WidthRequest=”64″>
<Button
CommandParameter=”{Binding Id}”
BackgroundColor=”#4CAF50″
Clicked=”MapButtonClicked”
Text=”Map”
HorizontalOptions=”FillAndExpand”></Button>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

C#:

protected void MapButtonClicked(object sender, EventArgs e)
{
var selectedLocation = _viewModel.Items.First(item =>
item.Id == int.Parse((sender as Button).CommandParameter.ToString()));

Utility.LaunchMapApp(selectedLocation.Latitude, selectedLocation.Longitude);
}

I’m pretty proud of this. Working on the app with the City of Fishers’ support, we’ve brought home a Mira Honorable Mention. After less than a year, we have thousands of users and two six arrests, with hundreds of incidents reported by Fishers residents. Pretty cool. Our team deserves it for all their hard work! Special thanks to Ed Gebhart, Mayor Scott Fadness, Chiefs Mitch Thompson and George Kehl, and the officers and citizens who continue to provide feedback to make this service even better for our community. 🙂

IBJ Article: https://www.techpoint.org/2017/04/mira-awards-winners-2017/

Mira Award Plaques

A little technical detail on the app, for those who are interested:

Platform: Xamarin with Xamarin.Forms, so we only had to write it once to deploy to iOS and Android. Yes, it really works.

Development Window: 18 months. Includes test runs with officers and the community.

Language: C#.

Time to Deploy to Google Play Store: Less than 15 minutes.

Time to Deploy to Approve Apple Developer Account: 3 months. They wouldn’t believe we were the City. Even with a phone call from the Mayor. That was an experience!

Time to Approve App, once we were in: 3 days. They were pretty cool after we were approved. 🙂

 

Want to learn all about Xamarin and how you can use it, while not spending most of your time watching code scroll by in a video? I figured there was room for an explainer without being a close-captioner for a code tutorial. Enjoy my latest video!

https://www.youtube.com/edit?video_id=AhvofyQCrhw

From the description, along with links:

Have you been considering Xamarin for your cross-platform mobile app? This presentation will help.

In this non-code-heavy presentation, we’ll discuss:

* What is Xamarin
* Development Environment Gotchas
* Creating a Sample To Do List App without writing any code
* Reviewing a real Xamarin app that’s “in the wild”
* Review native, platform-specific integrations
* Discuss gotchas when using Xamarin, and mobile apps in general
* Answer audience questions

Why not code-heavy? Because there are many examples you can follow online. This presentation will provide valuable information you can consider while reviewing the myriad of tutorials available to you with a simple Bing or Google search, or visiting Pluralsight, Microsoft Virtual Academy, or Xamarin University.

If you have any feedback, please leave in the comments, or ask me on Twitter: @Auri

Here are the links relevant for this presentation:

Slides: https://1drv.ms/p/s!AmKBMqPeeM_1-Zd7Y…

Indy.Code Slides with Cost and Performance Figures: https://1drv.ms/p/s!AmKBMqPeeM_1-JZR4…
(you can find the Indy.Code() presentation on my YouTube channel)

Google Xamarin vs. Native iOS with Swift/Objective C vs. Android with Java Performance Article: https://medium.com/@harrycheung/mobil…

Example code for push notifications, OAuth Twitter/Facebook/Google authentication, and more: https://github.com/codemillmatt/confe…

Link to Microsoft Dev Essentials for $30/month free Azure credit and free Xamarin training: https://aka.ms/devessentials

Microsoft Virtual Academy Multi-Threading Series: https://mva.microsoft.com/en-us/train…

 

I’m continuing my resolution to record as many of my programming and technical presentations as possible. I recently spoke at the inaugural Indy.Code() conference. It was excellent, with an incredible speaker line-up. I hope they, too, post some of their presentations online!

Watch the Video on YouTube

From the synopsis:

Should you write your app “native” or use a “cross-platform” solution like React Native, Xamarin, or NativeScript? The new wave of native-cross-compiling solutions provide significant cost savings, code reuse opportunities, and lower technical debt. Does wholly native, per platform development, still play a role in future mobile development? Let’s discuss together.

In this presentation, we’ll discuss:

  • The growth of native, hybrid, and cross-platform mobile development solutions
  • Cost analysis of multiple native and cross-platform apps
  • Considerations for each native and cross-platform solution
  • Lessons learned

Slides are available here: https://t.co/5iLhEoEfen

If you have any questions, I’m happy to answer them! Please email me or ask on Twitter.