我有一个使用 Visual Studio 2013 的 Xamarin.Forms (1.4.2.6359) 项目,并在下面创建了轮播页面。我想添加页面指示器,即轮播页面顶部的点。这可以通过 Xamarin Forms CarouselPage 完成吗?
public class SplashPage : CarouselPage
{
public SplashPage ()
{
this.Children.Add(new CarouselChild("Logo.png", "Welcome"));
this.Children.Add(new CarouselChild("Settings.png", "Settings"));
}
}
class CarouselChild : ContentPage
{
public CarouselChild(string image, string text)
{
StackLayout layout = new StackLayout
{
HorizontalOptions = LayoutOptions.CenterAndExpand,
VerticalOptions = LayoutOptions.CenterAndExpand,
};
layout.Children.Add(new Image
{
Source = image,
});
layout.Children.Add(new Label
{
HorizontalOptions = LayoutOptions.CenterAndExpand,
VerticalOptions = LayoutOptions.EndAndExpand,
Text = text,
Scale = 2,
});
this.Content = layout;
}
}
最佳答案
为了让事情变得简单,我所做的是:
我的轮播页面:
class MyCarouselPage : CarouselPage
{
private int totalPages;
private int currentPage;
public MyCarouselPage()
{
var pages = GetPages();
totalPages = pages.Length;
this.ChildAdded += MyCarouselPage_ChildAdded;
for (int i = 0; i < totalPages; i++)
{
currentPage = i;
this.Children.Add(pages[i]);
}
}
void MyCarouselPage_ChildAdded(object sender, ElementEventArgs e)
{
var contentPage = e.Element as MyPageBase;
if (contentPage != null)
{
contentPage.FinalStack.Children.Add(new CarouselPageIndicator(currentPage, totalPages, "indicator.png", "indicator_emtpy.png"));
}
}
private MyPageBase[] GetPages()
{
var pages = new MyPageBase[] { new Page1(), new Page2() };
return pages;
}
}
页面的基类
class MyPageBase:ContentPage
{
public StackLayout FinalStack { get; set; }
}
CarouselPageIndicator
public class CarouselPageIndicator : StackLayout
{
public CarouselPageIndicator(int currentIndex, int totalItems, string sourceIndicator, string souceEmptyIndicator)
{
this.Orientation = StackOrientation.Horizontal;
this.HorizontalOptions = LayoutOptions.CenterAndExpand;
for (int i = 0; i < totalItems; i++)
{
var image = new Image();
if (i == currentIndex)
image.Source = sourceIndicator;
else
image.Source = souceEmptyIndicator;
this.Children.Add(image);
}
this.Padding = new Thickness(10);
}
}
对于n-Pages
class Page1:MyPageBase
{
public Page1()
{
var layout = new StackLayout
{
Children = {
new Label{Text="Page 1"}
}
};
this.FinalStack = layout;
this.Content = FinalStack;
}
}
关于c# - 轮播页面指示器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30553101/