I set the width to fit the App.ScreenWidth. When selecting a segment the text gets
aligned to the start :
first:
then:
This is the control xaml code:
<control:SegmentedControl
x:Name="SegmentedControl"
WidthRequest="{Binding SegmentedControlWidth, Mode=TwoWay}"
HorizontalOptions="StartAndExpand"
VerticalOptions="StartAndExpand"
SelectedSegment="{Binding SelectedSegment, Mode=TwoWay}"
TintColor="{StaticResource ZAblue}"
SelectedTextColor="White"
DisabledColor="Gray"
FontSize="12"
HeightRequest="35">
<control:SegmentedControl.Behaviors>
<behaviors:EventToCommandBehavior
EventName="OnSegmentSelected"
Command="{Binding OnSegmentSelectedCommand}"
CommandParameter="{Binding .}"/>
</control:SegmentedControl.Behaviors>
</control:SegmentedControl>
And this is in my ViewModel:
[Reactive]
public ObservableCollection<SegmentedControlOption> SegmentedControlChildren { get; set; } = new ObservableCollection<SegmentedControlOption>();
public void SetupSegmentedControl()
{
var guidConverter = new GuidToStringConverter();
calculateVisibleSegments(_menuMainItem.Menus.Count);
var segmentControlItems = new ObservableCollection<SegmentedControlOption>();
foreach (DeviceMenuItem menu in _menuMainItem.Menus)
{
string menuNametext = (string)guidConverter.Convert(menu.Name, typeof(Guid), null, null);
if (!ParameterAndSubMenusEmpty(menu, _deviceService.GetDevice().AccessLevel))
{
SegmentedControlOption segControl = new SegmentedControlOption();
segControl.Text = menuNametext;
//segControl.Id = menu.ID;
if (segmentControlItems.FirstOrDefault(seg => seg.Text == menuNametext) == null)
{
segmentControlItems.Add(segControl);
}
}
}
SegmentedControlChildren = segmentControlItems;
calculateVisibleSegments(SegmentedControlChildren.Count);
//SelectedSegment = selectedSegment;
}
public void calculateVisibleSegments(int segments)
{
int min = 360;
int visibleSegments = 3;
while (App.ScreenWidth > min)
{
min += 150;
visibleSegments++;
}
if (segments <= visibleSegments)
{
SegmentedControlWidth = App.ScreenWidth - 10;
}
else
{
SegmentedControlWidth = (App.ScreenWidth / visibleSegments) * segments + 150;
}
}
I already tried:
- removing scrollview
- move it out of stacklayout
- remove the TwoWay Bindings
- change the selectedCommand from Behavior to property
I set the width to fit the App.ScreenWidth. When selecting a segment the text gets
aligned to the start :
first:
then:
This is the control xaml code:
And this is in my ViewModel:
I already tried: