Relative Layot

[Oleg]

Relative not working

    <RelativeLayout>
        <telerikGauges:RadRadialGauge x:Name="gauge" RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
                                                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
                                                     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
                                                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}" >
        </telerikGauges:RadRadialGauge>

        <Label RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=X, Factor=0.33}"
               RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Y, Factor=0.33}"
               RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Width, Factor=0.33}"
               RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Height, Factor=0.33}">
            <Label.FormattedText>
                <FormattedString>
                    <FormattedString.Spans>
                        <Span Text="Speed: "/>
                        <Span Text="33"/>
                    </FormattedString.Spans>
                </FormattedString>
            </Label.FormattedText>
        </Label>

    </RelativeLayout>

 

label alignment in top-left, it is not fine

[Yana]

Hello Oleg,

This is not related to the usage of RadGauge, if you replace RadGauge with a simple Xamarin.Forms BoxView, the same result can be observed.

It's rather related to the way RelativeLayout handles Factor value - the Factor is what percentage of the parent or view you want to use. Here is a good explanation on this: Can someone explain to me the constraints, factor and constant in xamarin forms?

I guess that you would need to add Constant value as well to make it work:

<RelativeLayout>
    <telerikGauges:RadRadialGauge BackgroundColor="Yellow" x:Name="gauge"
                                                    RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
                                                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
                                                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
                                                    RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}" >
    </telerikGauges:RadRadialGauge>

    <Label RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=X, Factor=0.33,Constant=100}"
            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Y, Factor=0.33,Constant=20}"
            RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Width, Factor=0.33}"
            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToView, ElementName=gauge, Property=Height, Factor=0.33}">
        <Label.FormattedText>
            <FormattedString>
                <FormattedString.Spans>
                    <Span Text="Speed: "/>
                    <Span Text="33"/>
                </FormattedString.Spans>
            </FormattedString>
        </Label.FormattedText>
    </Label>
</RelativeLayout>

I hope I was able to guide into the right direction, so you can achieve the required layout.

Regards,
Yana
Progress Telerik