xam-consulting / freshessentials

FreshEssentials for Xamarin.Forms has ONLY the most common extensions you need for Xamarin.Forms

FreshEssentials for Xamarin.Forms has ONLY the most common elements you need for Xamarin.Forms. It's contains the elements you need in almost every project and nothing more, things like BindablePicker, SegementedButtons, InverseBooleanConverter, TappedGestureAttached, ListViewItemTappedAttached and not much more. It's the lightweight essentials.

Configuration

iOS

To init Fresh Essentials on iOS, add the following line to your AppDelegate.cs:

new FreshEssentials.iOS.AdvancedFrameRendereriOS();

Controls

BindablePicker

BindablePicker inherits from Xamarin.Forms.Picker, you can binding data to ItemSource as Items, and also can set which property you want to display via DisplayProperty.

If you want to use it in XAML, you need to include the namespace first

xmlns:fe="clr-namespace:FreshEssentials;assembly=FreshEssentials"

Then

<fe:BindablePicker ItemsSource="{Binding MyCars}" SelectedItem="{Binding SelectedCar}" DisplayProperty="MakeAndModel" Title="Select..." />

AdvancedFrame (flexible rounded corners)

AdvancedFrame inherits from Frame, you can set corner type via Corners(There are only four type, left, right, all, none), you can also set CornerRadius and InnerBackground color

<fe:AdvancedFrame Corners="left" CornerRadius="10" InnerBackground="Blue" OutlineColor="Red" >
	<Label Text="Corners is left, CornerRadius is 10, InnerBackground is Blue" TextColor="White"/>
</fe:AdvancedFrame>

SegmentedButtonGroup

SegmentedButtonGroup is like iOS Segmented Controls, you can binding SelectedIndex for it

<fe:SegmentedButtonGroup OnColor="Blue" OffColor="White" SelectedIndex="{Binding SelectIndex, Mode=TwoWay}">
	<fe:SegmentedButtonGroup.LabelStyle>
		<Style TargetType="Label">
		    <Setter Property="FontSize" Value="12" />
			<Setter Property="FontAttributes" Value="Bold" />
		</Style>
	</fe:SegmentedButtonGroup.LabelStyle>
	<fe:SegmentedButtonGroup.SegmentedButtons>
		<fe:SegmentedButton Title="Button 1"/>
		<fe:SegmentedButton Title="Button 2"/>
		<fe:SegmentedButton Title="Button 3"/>
	</fe:SegmentedButtonGroup.SegmentedButtons>
</fe:SegmentedButtonGroup>

This is the component, works on iOS, Android and UWP soon.

Converters

InverseBooleanConverter

Used for binding inversed bool value

<ContentPage.Resources>
	<ResourceDictionary>
		 <fe:InverseBooleanConverter x:Key="InverseConverter" />
	</ResourceDictionary>
</ContentPage.Resources>

<Button Text="Click Me" IsVisible="{Binding ShowButton, Converter={StaticResource InverseConverter}}" />

Attached Properties

ListViewItemTappedAttached

Used for binding item tapped command to a ListView

<ListView ItemsSource="{Binding MyCars}" fe:ListViewItemTappedAttached.Command="{Binding ItemTapCommand}">

TappedGestureAttached

Used for binding a tapped command to any VisualElement.

<Image Source="xamconsulting.png" fe:TappedGestureAttached.Command="{Binding ImageTappedCommnad}" />

freshessentials's Issues

Text color in IPAD same as background color

Hi, the picker is not working on IPAD, it seems that the textcolor is the same as background. I have tried to change it with Control.SetTitleColor (UIKit.UIColor.Black, UIControlState.Normal ); but no luck.

Typo in GetCommandParameter and SetCommandParameter

Hi,

There is a typo in TappedGestureAttached where Get and Set CommandParameter are getting/setting Command rather than CommandParameter.

SegmentedButton Frame background color not rendering properly after becoming visible (iOS only)

If the SegmentedButton is initially invisible and is made visible the frame background and border colors are not showing until they are clicked on. Appears to be an issue for iOS (tested on simulator)

Error in Android and iOS

Hi guys,
I have a problem when I try to bind. The error is:

System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation.

I can't understand why. I copied your example code but I read the values from SQLite and then I created a list of element.

Thank you in advance,

Selected value

It would be nice to have another property so that we can display something different in the drop down after selection. Ie right now i am setting DisplayProperty to a composite property which combines a code and a name like USD - US Dollar. However, after selection i only want to see the value which is USD. Similar to how a web select list works.

Odd build issue with FreshEssentials

Somethings really odd about the iOS linker and FreshEssentials but it probably applies to other assemblies too. Unless I add a 'x:Name='picker'" to the BindablePicker xaml when I run my code in the iphone simulator the FreshEssentials assembly is not included and I get basically a class not found runtime exception ( i come from the Java world ) however I get no error when the File Generator runs. I don't know if there's some meta data you can add to the assembly to tell the linker "hey include me no matter what" or if that's outside the scope of the assembly.

Multiple calls to ListViewItemTappedAttached.Command

Let's say there is a ViewModel containing an ObservableCollection<Action> of Actions and a Command<Action> ExecuteActionCommand which obviously does some action.
The View for this ViewModel will be a ListView:

xmlns:fe="clr-namespace:FreshEssentials;assembly=FreshEssentials"
<ListView ItemsSource="{Binding Actions}" fe:ListViewItemTappedAttached.Command="{Binding ExecuteActionCommand}"/>

One touch on cell leads to one call of ExecuteActionCommand. Perfect.

Although after Actions list is modified with similar code

Actions.Clear(); Actions.Add(new Action());

the ExecuteActionCommand is hit multiple times. Further touches lead to even more command calls.

BindablePicker appearance

I was using an older FreshEssentials on my project that I compiled from code. Today I updated to the nuget version and I noticed that the BindablePicker lookis different but I do not know why. Here is an screenshot of a Xamarin Picker and the BindablePicker:

I would like the BindablePicker to look like the Picker. What defines the appearance of this control?

The BindablePicker backgound is mess in Android.

As you see the background is very mess, like a lot of pieces from other place.

I test the Android Phone and Table on the simulator, all same. (UWP all fine)

There are some pictures:

Update nuget with .net standard support?

The latest nuget package 2.1.3 is from januari 2017 and has no .net standard support. It seems that .net standard support is build in now but not released yet to the nuget package. Would it be possible to release a new up to date nuget package since it has all the things I need but it is the last package in my app that does not support .net standard.

Can't change Text FontSize

Is it possible to add a property in this component that can be bound in Xaml and used to set the Font size of the displayed label?

SegmentedButton not displaying properly on iOS

Hi, I'm having an issue using the SegmentedButtonGroup. When using it on iOS the text in the selected button in the group will not show up using default colours. There is no background on the selected button in iOS and so white text just doesn't show up. This isn't the default behaviour for a segmented button.

Error while using FreshEssentials controls

Hey,

So, i just added FreshEssentials via Nuget and included it in my view(1). And it is fine, even intellisense helping me when i`m trying to add BindablePicker (2)

Problem starts when i am deploying app to emulator, i am getting following error(for some reason i can not copy exceptions from Xamarin Studio):
Xamarin.Forms.Xaml.XamlParseException has been thrown
Position 27:6 Type controls:BindablePicker not found in xmlns clr-namespace:FreshEssentials;assembly:FreshEssentials

Exception is pretty clear but intellisense seems to see all controls while editing xaml so i have to assume that error lays somewhere else.

Any ideas?
I`m using Xamarin Studio with w10.

1xmlns:controls = "clr-namespace:FreshEssentials;assembly:FreshEssentials"
2<controls:BindablePicker ItemsSource="{Binding searchTypeList, Mode = TwoWay}" SelectedItem="{Binding selectedSearchType, Mode = TwoWay}" />

/edit: I am running only Android project. Can not check if it is working on IOS for now.

Weird issue with BindablePicker

Hi,

First of all, sorry if I make mistake in my English, I don't speak english fluently.

I have a little weird issue with BindablePicker on a specific platform.

I have an application which use the bindablePicker. My problem is on Windows Phone UWP, on the specific emulator 4'. I don't have a device to test if the problem is also present on it.

So, let's me try to explain that. I have this elements in my contentPage :

• Entry
• Label
• BindablePicker

My BindablePicker contains 7 items.
So, when I tap on Entry, a keyboard show to enter the text. If I tap on BindablePicker, the list doesn't show items (in fact, it shows them, but in disorder and if I click on one of it, the list become blank).

Do you experiment the same problem?

I will try to reproduce the bug on a clear app with no confidentiality issue :)

error display example bindablepicker

i can`t display the picker in mi app Droid, download the code and fails the same (BindablePickerExample) , does not display the screen, only IOs.

Can you help me, thanks

BindablePicker - BindableProperty Deprecated. Do not use

https://developer.xamarin.com/api/type/Xamarin.Forms.BindableProperty/

Setting AdvancedFrame.WidthRequest = 100 on constructor prevents to use it when you need it to fit it's content

Let's supose you have a label that needs to be involved by a frame with rounded corners.
Since you are setting the frame WidthRequest = 100 on AdvancedFrame's contructor, it prevents the frame to auto ajust its with base on the value of its content (chield element);
Please stop to set this property on AdvancedFrame constructor.

Try the example below.
The original Xamarin.Forms Frame fits the label correctly while the AdvancedFrame doesn't...

`

`

System.TypeLoadException when using BindablePicker in XAML

Hello,

I am trying to use BindablePicker to bind with a CarList and car names as DisplayProperty. But when I use the BindablePicker in xaml my app gives a System.TypeLoadException when starting the app: System.TypeLoadException: Could not load type 'FreshEssentials.Droid.BindablePickerRendererDroid' from assembly 'FreshEssentials.Droid, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'.

This is my XAML, I also include fresh essentials.
xmlns:fe="clr-namespace:FreshEssentials;assembly=FreshEssentials"

<fe:BindablePicker x:Name ="carPicker" ItemsSource="{Binding curModel.CarsList}" DisplayProperty="CarName" Title="My Cars" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" HorizontalOptions="Center"/>

I have tried to downgrade Xamarin.Forms to 2.2.0.45 but that doesn't work. When i don't use the BindablePicker(but still have the NuGet installed) the app gives no problems.

Thanks in advance

Invalid Cast Exception with BindablePicker

I have used FreshEssentials BindablePicker in other projects fine, but am having a very strange problem with a particular Page/PageModel.

I have stripped the Page and PageModel right down to the following:
Page:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="Manager.Pages.Config.RemoteConnectionsPage"
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:fe="clr-namespace:FreshEssentials;assembly=FreshEssentials">
    <ContentPage.Content>
        <StackLayout Orientation="Vertical">
            <Label HorizontalOptions="CenterAndExpand" Text="Main Page" />
            <fe:BindablePicker DisplayProperty="Name" ItemsSource="{Binding Environments}" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

PageModel:

using System.Collections.Generic;
using FreshMvvm;
using PropertyChanged;

namespace Manager.PageModels.Config
{
    [ImplementPropertyChanged]
    public class RemoteConnectionsPageModel : FreshBasePageModel
    {
        public enum Environment
        {
            Live,
            Test,
            Third
        }

        public class EnvironmentPickerItem
        {
            public string Name {
                get {
                    return Env.ToString ();
                }
            }

            public Environment Env {
                get;
                set;
            }
        }
        public RemoteConnectionsPageModel ()
        {
            List<EnvironmentPickerItem> _Environments;
            _Environments = new List<EnvironmentPickerItem> ();
            _Environments.Add (new EnvironmentPickerItem () { Env = Environment.Live });
            _Environments.Add (new EnvironmentPickerItem () { Env = Environment.Test });
            _Environments.Add (new EnvironmentPickerItem () { Env = Environment.Third });
            this.Environments = _Environments;
        }

        public List<EnvironmentPickerItem> Environments {
            get;
            set;
        }
    }
}

The problem is when I run the application, I get the exception below (full stack trace truncated):

System.InvalidCastException: Specified cast is not valid.
at FreshEssentials.Droid.BindablePickerRendererDroid.OnElementChanged (Xamarin.Forms.Platform.Android.ElementChangedEventArgs1[TElement] e) [0x00031] in C:\Users\Michael\Documents\FreshEssentials\src\Droid\Renderers\BindablePickerRendererDroid.cs:46 at Xamarin.Forms.Platform.Android.VisualElementRenderer1[TElement].SetElement (TElement element) [0x000f4] in C:\BuildAgent3\work\ca3766cfc22354a1\Xamarin.Forms.Platform.Android\VisualElementRenderer.cs:190
at Xamarin.Forms.Platform.Android.VisualElementRenderer`1[TElement].Xamarin.Forms.Platform.Android.IVisualElementRenderer.SetElement (Xamarin.Forms.VisualElement element) [0x00027] in C:\BuildAgent3\work\ca3766cfc22354a1\Xamarin.Forms.Platform.Android\VisualElementRenderer.cs:131

Looking at the source for the BindablePickerRendererDroid from the FreshEssentials repository, it appears to be the line:

((ObservableCollection<string>)e.NewElement.Items).CollectionChanged += RowsCollectionChanged;

in this method.

protected override void OnElementChanged(ElementChangedEventArgs<BindablePicker> e)
        {
            if (e.OldElement != null)
                ((ObservableCollection<string>)e.OldElement.Items).CollectionChanged -= RowsCollectionChanged;

            if (e.NewElement != null)
            {
                ((ObservableCollection<string>)e.NewElement.Items).CollectionChanged += RowsCollectionChanged;
                if (Control == null)
                {
                    var button = new AButton(Context) { Focusable = false, Clickable = true, Tag = this, Text = e.NewElement.Title };
                    button.SetOnClickListener(PickerListener.Instance);
                    SetNativeControl(button);
                }
                UpdatePicker();
            }

            base.OnElementChanged(e);
        }

The strange thing is that taking the above exact code into a brand new project works fine. I have checked versions of FreshEssentials and FreshMVVM, and they're identical between the working and non-working projects.

Anyone come across this, and/or any thoughts?

Full Xamarin Studio and other version info below:

=== Xamarin Studio Community ===

Version 6.1.4 (build 1)
Installation UUID: 462e6ba8-9cb7-4b87-acc8-9dfb0ab2c6f7
Runtime:
Mono 4.6.2 (mono-4.6.0-branch/ac9e222) (64-bit)
GTK+ 2.24.23 (Raleigh theme)

Package version: 406020016

=== NuGet ===

Version: 3.4.3.0

=== Xamarin.Profiler ===

Version: 0.33.2
Location: /Applications/Xamarin Profiler.app/Contents/MacOS/Xamarin Profiler

=== Xamarin.Android ===

Version: 7.0.2.42 (Xamarin Studio Community)
Android SDK: /Users/jameslavery/Library/Developer/Xamarin/android-sdk-macosx
Supported Android versions:
2.3 (API level 10)
4.0.3 (API level 15)
4.1 (API level 16)
4.3 (API level 18)
4.4 (API level 19)
5.0 (API level 21)
5.1 (API level 22)
6.0 (API level 23)

SDK Tools Version: 24.4.1
SDK Platform Tools Version: 23.1
SDK Build Tools Version: 23.0.1

Java SDK: /usr
java version "1.7.0_71"
Java(TM) SE Runtime Environment (build 1.7.0_71-b14)
Java HotSpot(TM) 64-Bit Server VM (build 24.71-b01, mixed mode)

Android Designer EPL code available here:
https://github.com/xamarin/AndroidDesigner.EPL

=== Xamarin Android Player ===

Version: 0.6.5
Location: /Applications/Xamarin Android Player.app

=== Apple Developer Tools ===

Xcode 8.0 (11246)
Build 8A218a

=== Xamarin.iOS ===

Version: 10.3.1.8 (Xamarin Studio Community)
Hash: 7beaef4
Branch: cycle8-xi
Build date: 2016-12-20 02:58:14-0500

=== Xamarin.Mac ===

Version: 2.10.0.120 (Xamarin Studio Community)

=== Build Information ===

Release ID: 601040001
Git revision: e606823f2dd01b4552216c013b597a73bec2068f
Build date: 2017-01-10 17:28:57-05
Xamarin addins: c92d0626d347aaa02839689eaac2961d24c9f446
Build lane: monodevelop-lion-cycle8

=== Operating System ===

Mac OS X 10.11.6
Darwin Jamess-MacBook-Pro.local 15.6.0 Darwin Kernel Version 15.6.0
Thu Jun 23 18:25:34 PDT 2016
root:xnu-3248.60.10~1/RELEASE_X86_64 x86_64

=== Enabled user installed addins ===

StyleCop Support 1.0.1.9
Gorilla Player 0.9.1.2
XamlStyler 1.0.2

AdvencedFrame rounded corners not working

Hi seems like your advanced frame corners is not quite working properly setting this in xaml is just making a hard edge corners rectangle (taken from from samplecode):

<freshEssentials:AdvancedFrame Corners="all" CornerRadius="30" InnerBackground="Gold" OutlineColor="Red" HorizontalOptions="Center" WidthRequest="200">
                  <Label Text="Corners is All CornerRadius is 30" />
              </freshEssentials:AdvancedFrame>

Perhaps its from a recent update of xamarin forms

BindablePicker not show the selected item in Android(xamarin.forms)

I'm using Xamarin.Forms v2.3.1.114. and FreshEssentials 2.1.0
I'm using Visual Studio debug with Android emulator. as you see in the picture the selected item not show in the BindablePicker.
UWP all fine. this only show on in Android .

There is a picture:

##FeatureRequest: ItemsSource for SegmentedButtonGroup

##FeatureRequest
It would be nice if SegmentedButtonGroup had a bindable ItemsSource and a property so assign the string property to show as button title so we can dynamically bind the buttons using mvvm.

Advanced frame innerBackground binding not working

Hi seems the binding is not working for the inner background property of the advanced frame, i'm creating a binding between a custom ui component and my view model to update the inner background color of the advanced frame in a property changed delegate. When however i change the backgroundcolor property of the advanced frame I get the updated color change as expected, but not currently for the innerbackground color.

Cannot default picker value

Maybe I missed something but I have the BindablePicker implemented in my XAML file with SelectedItem set to a bindable property within my view model in TwoWay mode. Your example, had the list loading after a button click after the page had already loaded. I implemented my page by running the OnPropertyChange within the setter of my list used as the picker options, in the view model. So in my constructor when I set the list it loads the list before the page is shown. With this setup the list loads before the page is shown and it sets the selected correctly upon choosing an item but I can never get the picker to default via setting the selected object within the constructor of my view model before the page loads. The picker is displayed as if nothing has been selected. However, my view model has the correct value set which should be bound to the SelectedItem of the list. Is this possible?

Set CornerRadius for SegmentedButtonGroup

Is there a way to specify a non-default corner radius to be used for the AdvancedFrame utilized in rendering the SegmentedButtonGroup control? Looking at the source code, I didn't see where this property was exposed.

Thanks for sharing your talents and making this library available!

Feature Request: Text Alignment on BindablePicker

Would just like to have text alignment options for BindablePicker: Start, End, Center.

Add support for "OnTextColor" and "OffTextColor" to SegmentedButtonGroup

Setting the Label TextColor using the LabelStyle does not work for the SegmentedButtonGroup.

And I would rather have an overall option like the OnColor and OffColor options to override the Label TextColor for Active (ON) Segmented Buttons and Off.

Make Segmented Button List Bindable

I am trying to dynamically populate the list of segmented buttons in the SegmentedButtonGroup control. Being able to bind to an observable would be the ideal solution. Being able to configure the button list from code would work as well.

BindablePicker.cs question

In the OnSelectedItemChanged event, should the SelectedIndex be set to -1 when SelectedItem == null?

private static void OnSelectedItemChanged(BindableObject bindable, object oldValue, object newValue)
{
BindablePicker picker = (BindablePicker)bindable;
picker.SelectedItem = newValue;
if (picker.ItemsSource != null && picker.SelectedItem != null)
{
int count = 0;
foreach (object obj in picker.ItemsSource)
{
if (obj == picker.SelectedItem)
{
picker.SelectedIndex = count;
break;
}
count++;
}
}
}

For instance:
else picker.SelectedIndex = -1;

Thank you for your consideration.