如何在contentpage的contentview的stacklayout中添加控件?

时间:2017-12-11 09:53:25

标签: c# xamarin xamarin.ios xamarin.forms xamarin.android

我正在使用xamarin.forms。有两个项目Android和IOS。

我有一个包含以下代码的ContentView页面

<ContentView.Content>
    <StackLayout x:Name="slMain" Padding="1" BackgroundColor="#7ABA45">
        <StackLayout VerticalOptions="FillAndExpand" Padding="0,0,20,0" HeightRequest="50" HorizontalOptions="FillAndExpand">
            <Label x:Name="lblTitle" VerticalOptions="CenterAndExpand"  />
        </StackLayout>
        <StackLayout x:Name="sl" IsVisible="False" BackgroundColor="White">
        </StackLayout>
    </StackLayout>
</ContentView.Content>


// In Behind code(.cs file)

    public ExpandCollapseStackLayout()
    {
        InitializeComponent(); 
        var tapGestureRecognizer = new TapGestureRecognizer();
        tapGestureRecognizer.Tapped += (s, e) =>
        {
            sl.IsVisible = !sl.IsVisible;
        };
        lblTitle.GestureRecognizers.Add(tapGestureRecognizer);
        slMain.GestureRecognizers.Add(tapGestureRecognizer);
    }

    public string Title
    {
        get
        {
            return lblTitle.Text;
        }
        set
        {
            lblTitle.Text = value;
        }
    }

我想在StackLayout中添加名为&#34; sl&#34;在设计时ContentPage中的contentview。 我不想在运行时添加

请建议我如何在Contentview stacklayout中添加Control?

2 个答案:

答案 0 :(得分:2)

如果要在设计时添加控件,只需在XAML中声明它们,例如:

<StackLayout x:Name="sl" IsVisible="False" BackgroundColor="White">
  <!-- Add here your controls -->
  <Label ... />
  <Button .. />
</StackLayout>

如果要在运行时添加控件,则需要使用C#中的代码隐藏页面来执行此操作。例如:

void AddControl()
{
  var btn = new Button();
  sl.Children.Add(btn);
}

答案 1 :(得分:2)

ContentView代码:

<ContentView.Content>
    <StackLayout x:Name="slMain" Padding="1" BackgroundColor="#7ABA45" >
        <StackLayout VerticalOptions="FillAndExpand" Padding="0,0,10,0" HeightRequest="50" HorizontalOptions="FillAndExpand" Orientation="Horizontal">
            <Label x:Name="lblTitle" VerticalOptions="CenterAndExpand" HorizontalOptions="FillAndExpand" Margin="10,0,0,0" TextColor="White" FontAttributes="Bold"  />
            <Label Text="{ x:Static local:GrialShapesFont.ArrowDown }" HorizontalOptions="End" VerticalOptions="CenterAndExpand" TextColor="White" Style="{ StaticResource FontIconBase }" FontSize="26" />
        </StackLayout>
        <Frame Padding="10" IsVisible="False" BackgroundColor="White" x:Name="ContentFrame" OutlineColor="Black" HasShadow="False">
        </Frame>
    </StackLayout>
</ContentView.Content>

ContentView的CS代码:

[ContentProperty("ContainerContent")]
public partial class ExpandCollapseStackLayout : ContentView
{
    public ExpandCollapseStackLayout()
    {
        InitializeComponent();
        var tapGestureRecognizer = new TapGestureRecognizer();
        tapGestureRecognizer.Tapped += (s, e) =>
        {
            ContentFrame.IsVisible = !ContentFrame.IsVisible;
        };
        lblTitle.GestureRecognizers.Add(tapGestureRecognizer);
        slMain.GestureRecognizers.Add(tapGestureRecognizer);
    }

    public View ContainerContent
    {
        get { return ContentFrame.Content; }
        set { ContentFrame.Content = value; }
    }
    public string Title
    {
        get
        {
            return lblTitle.Text;
        }
        set
        {
            lblTitle.Text = value;
        }
    }
}

在ContentPage中添加控件:

<control:ExpandCollapseStackLayout Title="Demo" Padding="0,10,0,0">
                <control:ExpandCollapseStackLayout.ContainerContent >
                    <StackLayout>
                        <Label Text="Add Content Here"></Label>
                    </StackLayout>
                </control:ExpandCollapseStackLayout.ContainerContent>
 </control:ExpandCollapseStackLayout>