我需要为我们的应用制作多屏幕介绍教程。它看起来应该是这样的 - > 第一个屏幕有动画,它会自动开始 - >用户滑动以更改页面(屏幕) - >第二个屏幕有动画并且它会自动启动 - >用户滑动... 等等四个屏幕。
我做了一个完美的例子但是每个屏幕都有效,而不是动画它有图片。我知道如何制作DrawableAnimations,你可以在下面的例子中看到,它们是逐帧制作的。我只是想请某人帮助我在布局和MainActivity中实现这些动画。以下是我的MainActivity,Main布局,LayoutSlide的代码(每个屏幕的布局,显示该步骤的动画)。 AnimatedScreen(要设置动画的项目列表)。
注意:这是使用图片而不是动画的代码,如果我的问题的解决方案比我想象的更复杂并且有人有解决方案,我们可以联系彼此通过电子邮件或Skype或任何其他服务。
MainActivity:
using Android.App;
using Android.Widget;
using Android.OS;
using Android.Support.V7.App;
using Android.Support.V4.View;
using Android.Views;
using Android.Content;
using Android.Text;
using Android.Content.Res;
using Android.Graphics;
using Android;
using Android.Graphics.Drawables;
namespace IntroSliderEndy
{
[Activity(Label = "SliderForTheFirstLaunch")]
public class MainActivity : AppCompatActivity
{
ViewPager viewPager;
LinearLayout dotsLayout;
TextView[] dots;
public int[] layouts;
Button btnNext, btnSkip;
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
SetContentView(Resource.Layout.Main);
layouts = new int[]
{
Resource.Layout.LayoutSlide1,
Resource.Layout.LayoutSlide2,
Resource.Layout.LayoutSlide3,
Resource.Layout.LayoutSlide4
};
viewPager = (ViewPager)FindViewById(Resource.Id.viewPager);
dotsLayout = (LinearLayout)FindViewById(Resource.Id.layoutPanel);
btnNext = (Button)FindViewById(Resource.Id.btn_next);
btnSkip = (Button)FindViewById(Resource.Id.btn_skip);
addDots(0);
ViewPagerAdapter adapter = new ViewPagerAdapter(layouts);
viewPager.Adapter = adapter;
viewPager.PageSelected += ViewPager_PageSelected;
//viewPager.AddOnPageChangeListener(new ViewPager.IOnPageChangeListener());
btnNext.Click += (sender, e) =>
{
int current = GetItem(+1);
if (current < layouts.Length)
//Pomakni se u drugi screen
viewPager.CurrentItem = current;
else
{
//Pokreni prvi screen - inace ce se tu otvoriti aplikacija
Intent intent = new Intent(this, typeof(MainActivity));
StartActivity(intent);
}
};
btnSkip.Click += (sender, e) =>
{
Intent intent = new Intent(this, typeof(MainActivity));
StartActivity(intent);
};
}
void ViewPager_PageSelected(object sender, ViewPager.PageSelectedEventArgs e)
{
addDots(e.Position);
if (e.Position == layouts.Length - 1)
{
//Ako je zadnja stranica stavi "GOT IT"
btnNext.Text = (GetString(Resource.String.start));
btnSkip.Visibility = ViewStates.Gone;
}
else
{
//Ako nije zadnja stranica
btnNext.Text = (GetString(Resource.String.next));
btnSkip.Visibility = ViewStates.Visible;
}
}
private void addDots(int currentPage)
{
dots = new TextView[layouts.Length];
string[] colorsActive = { "#6A2D4E", "#6A2D4E", "#6A2D4E", "#6A2D4E" };
string[] colorsInactive = { "#C099AE", "#C099AE", "#C099AE", "#C099AE" };
dotsLayout.RemoveAllViews();
for (int i = 0; i < dots.Length; i++)
{
dots[i] = new TextView(this);
dots[i].Text = (Html.FromHtml("•")).ToString();
dots[i].TextSize = 35;
dots[i].SetTextColor(Color.ParseColor(colorsActive[currentPage]));
dotsLayout.AddView(dots[i]);
}
if (dots.Length > 0)
{
dots[currentPage].SetTextColor(Color.ParseColor(colorsInactive[currentPage]));
}
}
int GetItem(int i)
{
return viewPager.CurrentItem + i;
}
public class ViewPagerAdapter : PagerAdapter
{
LayoutInflater layoutInflater;
int[] _layout;
public ViewPagerAdapter(int[] layout)
{
_layout = layout;
}
public override Java.Lang.Object InstantiateItem(ViewGroup container, int position)
{
layoutInflater = (LayoutInflater)Android.App.Application.Context.GetSystemService(Context.LayoutInflaterService);
View view = layoutInflater.Inflate(_layout[position], container, false);
container.AddView(view);
return view;
}
public override int Count
{
get
{
return _layout.Length;
}
}
public override bool IsViewFromObject(View view, Java.Lang.Object objectValue)
{
return view == objectValue;
}
public override void DestroyItem(ViewGroup container, int position, Java.Lang.Object objectValue)
{
View view = (View)objectValue;
container.RemoveView(view);
}
}
}
}
主要布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="@+id/layoutPanel"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="40dp"
android:gravity="center"
android:layout_marginBottom="15dp"
android:orientation="horizontal" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:alpha="0.5"
android:layout_above="@id/layoutPanel"
android:background="@android:color/white" />
<Button
android:id="@+id/btn_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:background="@android:color/transparent"
android:text="@string/next"
android:textColor="#6A2D4E" />
<Button
android:id="@+id/btn_skip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="@android:color/transparent"
android:text="@string/skip"
android:textColor="#6A2D4E" />
</RelativeLayout>
LayoutSlide1(这只是第一个屏幕的示例,但其他屏幕相同,因为我只使用不同的背景):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/screen1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical">
</LinearLayout>
</RelativeLayout>
最后,FirstScreenAnimated(SecondScreen和第三和第四代码相同,只是不同的图片):
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true">
<item android:drawable="@drawable/BoyIntroFirst01"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst02"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst03"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst04"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst05"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst06"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst07"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst08"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst09"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst10"
android:duration="150" />
<item android:drawable="@drawable/BoyIntroFirst11"
android:duration="150" />
</animation-list>
感谢任何帮助!
答案 0 :(得分:0)
根据您的代码,我猜您想要在用户滑动ViewPager
时在页面之间显示动画,然后您只需将Transformer
设置为ViewPager
即可。例如:
...
viewpager.Adapter = adapter;
viewpager.SetPageTransformer(true, new ZoomOutPageTransformer());
由于您没有要求特定动画,ZoomOutPageTransformer
只是我根据官方文档修改的示例:Customize the Animation with PageTransformer:
public class ZoomOutPageTransformer : Java.Lang.Object, IPageTransformer
{
private static float MIN_SCALE = 0.85f;
private static float MIN_ALPHA = 0.5f;
public void TransformPage(View page, float position)
{
int pageWidth = page.Width;
int pageHeight = page.Height;
if (position < -1)
{
page.Alpha = 0;
}
else if (position <= 1)
{
float scaleFactor = Math.Max(MIN_SCALE, 1 - Math.Abs(position));
float vertMargin = pageHeight * (1 - scaleFactor) / 2;
float horzMargin = pageWidth * (1 - scaleFactor) / 2;
if (position < 0)
page.TranslationX = (horzMargin - vertMargin) / 2;
else
page.TranslationX = (vertMargin - horzMargin) / 2;
//Scale the page down
page.ScaleX = scaleFactor;
page.ScaleY = scaleFactor;
page.Alpha = (MIN_ALPHA + scaleFactor - MIN_SCALE) / (1 - MIN_SCALE) * (1 - MIN_ALPHA);
}
else
{
page.Alpha = 0;
}
}
}