[Xamarin] 幾個layout 控件

1.StackLayout c#

下面的demo主要是利用反射獲取layoutOption全部值,而後爲每個值建一個Label,達到展現LayoutOption的目的,效果圖從書上截的,其中StackLayout 是一個佈局容器佈局

class VerticalOptionsDemoPage : ContentPage
    {
        public VerticalOptionsDemoPage()
        {
            Color[] colors = { Color.Yellow, Color.Blue};
            int flipFlopper = 0;

            //Create Label sorted by LayoutAlignment property
            IEnumerable<Label> labels = from field in typeof(LayoutOptions).GetRuntimeFields()
                                        where field.IsPublic && field.IsStatic
                                        orderby ((LayoutOptions)field.GetValue(null)).Alignment
                                        select new Label
                                        {
                                            Text = "VerticalOption = " + field.Name,
                                            VerticalOptions = (LayoutOptions)field.GetValue(null),
                                            XAlign = TextAlignment.Center,
                                            Font = Font.SystemFontOfSize(NamedSize.Large),
                                            TextColor = colors[flipFlopper],
                                            BackgroundColor = colors[flipFlopper = 1 - flipFlopper]
                                        };

            //Transfer to Stacklayout
            StackLayout stackLayout = new StackLayout();

            foreach (Label label in labels)
            {
                stackLayout.Children.Add(label);
            }

            this.Padding = new Thickness(0, Device.OnPlatform(20,0,0),0,0);
            this.Content = stackLayout;
        }
    }

    // Summary:
    //     A Xamarin.Forms.Layout<T> that positions child elements in a single line
    //     which can be oriented vertically or horizontally.
    //
    // Remarks:
    //     This layout will set the child bounds automatically during a layout cycle.
    //     User assigned bounds will be overwritten and thus should not be set on a
    //     child element by the user.
    public class StackLayout : Layout<View>

效果圖this

2.Frame and BoxViewspa

The Frame displays a rectangular border surrounding some content. code

The BoxViewis a simple filled rectangle.orm

Frame ,BoxView,StackLayout 可相互嵌套,示例的CreateColorView返回一個嵌套着StackLayout,裏面再放着BoxView和labelip

   class ColorBlockPage : ContentPage
    {
        View CreateColorView(Color color, string name)
        {
            return new Frame
            {
                Content = new StackLayout
                {
                    Spacing = 15,
                    Children = 
                    {
                        new BoxView
                        {
                            Color = color
                        },
                        new Label
                        {
                            Text = name
                        }
                    }
                }
            };
        }
    }

3.ScrollViewci

能夠把ScrollView嵌套在StackLayout裏顯示長篇的文字,和HTML裏打開Scrol的textarea差很少意思,具體用法API有示例了element

相關文章
相關標籤/搜索