Using your control

[JesseLiberty]

Hi, I'd like to use your control but have a few questions. First, what is the usage license (specifically, can we use it in a commercial application?)

Second, I'd like to discuss what kinds of modifications (e.g., background color, etc.) can be made (presumably only on Android and through the custom rendering).

I have a few others, and also want to blog about it. I wonder if you could contact me at jesseliberty@gmail.com? Thanks.

Jesse Liberty

[chrispellett]

Added an MIT license so you are free to use in any application.

Modifications are pretty easy to add and you are correct that it is through the custom rendering/Android resources.

Happy to incorporate any improvements/suggestions as this was simply a get-to-know control.

[VeryKross]

Really nicely done - I can see plenty of places where this will come in very handy! One question - is there a way to set the initial "active" segment? I might just be missing it - have been digging around in both your control implementation and also Jesse's exploration of it.

[jbarreda]

Can you use this control in a non-Xaml project?

[AaronBratcher]

Can you give instructions on how to add this to my own personal solution? I'm new to Xamarin and Forms and have no clue where to begin. 😊

[VeryKross]

Hi Aaron,

You'll just need to copy a few files from the SegmentedControl source and add them to the projects in your solution. Assuming you are using a PCL for your shared code, copy the "SegmentedControl.cs" from the source to your PCL project. Then copy the "SegmentedControlRenderer.cs" from the source iOS project into your iOS project and the same with the "SegmentedControlRenderer.cs" file from the source Android project to your Android project. You may also need to fix up the namespaces in those files once you've copied them (especially if you copy them into sub-directories in your projects - for example, I put all my Renderers in a project folder called "Renderers" and in my PCL I put all controls in a folder called "Controls").

Use use the control in XAML you'll need to create a namespace reference to where you put the SegmentControl.cs file - something like:

xmlns:controls="clr-namespace:MyMobileApp.Controls;assembly=MyMobileApp"

Then to use the control your XAML would look something like:

  <controls:SegmentedControl x:Name="SegControl" ValueChanged="OnSegmentTapped" >
    <controls:SegmentedControl.Children>
      <controls:SegmentedControlOption Text="Seg 1" />
      <controls:SegmentedControlOption Text="Seg 2" />
      <controls:SegmentedControlOption Text="Seg 3" />
    </controls:SegmentedControl.Children>
  </controls:SegmentedControl>

This creates a control with 3 segments. Note also the OnSegmentTapped reference; that's an event handler in the page's code-behind that will fire when a segment is tapped (you could call it whatever you like).

Inside that event handler you can then retrieve the SelectedValue of your control by name - mine was named "SegControl" an so I can reference SegControl.SelectedValue to get name of the segment that was tapped on (e.g. "Seg 1").

I hope this helps get you going.

Ken

[AaronBratcher]

Thanks for the response.

[alexrainman]

How can i make it 100% width with each button width in percent? Example: 4 buttons 25% width.

[AaronBratcher]

I have literally spent hours trying to get this to work in a clean solution. May I send you a copy of the solution and you tell me why this isn't rendering in Android?

[alexrainman]

Yeah, you can send it to me. I simplified your Android renderer and i want to share that with you too.

[AaronBratcher]

Got binding fixed. Now just need to set a default value.