How to put a Tabbed Page in half screen?

EurusEurus Member ✭✭

Problem is that I have a simple Content Page with a Boxview. This BoxView shows just a user photo and under boxview I want put a tabbed Page. I tried to import Tabbed into Content Page, but as I imaged doesn't works... I have attached this horrible drawing to make you
understand...

Answers

  • chetanrawatchetanrawat USMember ✭✭✭

    Hi,@Eurus
    It's not possible with Tabbed Page you can do same things with segment control

  • JarvanJarvan Member, Xamarin Team Xamurai

    The following code can achieve the feature you want. Create a contentView and add it when clicking the button.
    page.xaml

    <ContentPage.Content>
        <StackLayout>
            <StackLayout>
                <Label Text="TabbedView"
                           HorizontalOptions="CenterAndExpand"/>
                <BoxView BackgroundColor="Red"
                             HorizontalOptions="FillAndExpand"
                             HeightRequest="180"/>
            </StackLayout>
            <Grid BackgroundColor="White">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Button Text="page1" Grid.Column="0" Grid.Row="0" HorizontalOptions="FillAndExpand" Clicked="Button_Clicked" BackgroundColor="White"/>
                <Button Text="page2" Grid.Column="1" Grid.Row="0" HorizontalOptions="FillAndExpand" Clicked="Button_Clicked2" BackgroundColor="White"/>
                <Button Text="page3" Grid.Column="2" Grid.Row="0" HorizontalOptions="FillAndExpand" Clicked="Button_Clicked3" BackgroundColor="White"/>
            </Grid>
            <StackLayout x:Name="_layout"/>
        </StackLayout>
    </ContentPage.Content>
    

    page.xaml.cs

    public partial class Page5 : ContentPage
    {
        public Page5()
        {
            InitializeComponent();
        }
    
        private void Button_Clicked(object sender, EventArgs e)
        {
            _layout.Children.Clear();
            _layout.Children.Add(new View1());
        }
    
        private void Button_Clicked2(object sender, EventArgs e)
        {
            _layout.Children.Clear();
            _layout.Children.Add(new View2());
        }
    
        private void Button_Clicked3(object sender, EventArgs e)
        {
            _layout.Children.Clear();
            _layout.Children.Add(new View3());
        }
    }
    
Sign In or Register to comment.