SlidingPanelLayout在android中从右到左效果不佳 [英] SlidingPanelLayout not work well from right to left in android
问题描述
我正在从右到左创建 SlidingPanelLayout 以实现 filter
的目的。面板可以很好地从右侧出来并进行动画处理,但是当动画停止时,它直接移到左侧,但是我希望该比率为70%,这意味着右侧面板显示了总屏幕的70%
,当再次单击它时
I am creating SlidingPanelLayout from right to left for the filter
purpose.The panel work fine it come out from right side and does animation but when Animation is stop it directly go to left side full but I want the ratio is 70% means right side panel came out 70% of the total screen
and when click again it goes to hind and full Activity is display.
第一次停止动画时,侧面板位于屏幕截图的左侧,但我希望它位于右侧。
When first time Animation is stop the side panel goes to left side in the screenshot .But I want it right side.
屏幕截图:
但是我要显示它的写面,当再次单击时它将在右边再次隐藏。
but i want to display it write side and when click again it will go right side and hide again.
activity_inventory.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#e6e6e6"
android:id="@+id/mainLayout"
tools:context="com.example.softeng.jogi.InventoryActivity">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/backLayout"
tools:ignore="NotSibling">
</RelativeLayout>
<include
layout="@layout/filter"/>
<com.rey.material.widget.FloatingActionButton
android:id="@+id/button_bt_float_wave_color"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
style="@style/LightFABWaveColor"
android:layout_margin="8dp"/>
</RelativeLayout>
filter.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:id="@+id/filter_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0072BA"
android:visibility="invisible">
</RelativeLayout>
</RelativeLayout>
filterAnimation.java
public class FilterAnimation implements Animation.AnimationListener
{
Context context;
RelativeLayout filterLayout, otherLayout;
private Animation filterSlideIn, filterSlideOut, otherSlideIn, otherSlideOut;
private static int otherLayoutWidth, otherLayoutHeight;
private boolean isOtherSlideOut = false;
private int deviceWidth;
private int margin;
public FilterAnimation(Context context)
{
this.context = context;
DisplayMetrics displayMetrics = context.getResources().getDisplayMetrics();
deviceWidth = displayMetrics.widthPixels; // as my animation is x-axis related so i gets the device width and will use that width,so that this sliding menu will work fine in all screen resolutions
}
public void initializeFilterAnimations(RelativeLayout filterLayout)
{
this.filterLayout = filterLayout;
filterSlideIn = AnimationUtils.loadAnimation(context, R.anim.filter_slide_in);
filterSlideOut = AnimationUtils.loadAnimation(context, R.anim.filter_slide_out);
}
public void initializeOtherAnimations(RelativeLayout otherLayout)
{
this.otherLayout = otherLayout;
otherLayoutWidth = otherLayout.getWidth();
otherLayoutHeight = otherLayout.getHeight();
otherSlideIn = AnimationUtils.loadAnimation(context, R.anim.other_slide_in);
otherSlideIn.setAnimationListener(this);
otherSlideOut = AnimationUtils.loadAnimation(context, R.anim.other_slide_out);
otherSlideOut.setAnimationListener(this);
}
public void toggleSliding()
{
if(isOtherSlideOut) //check if findLayout is already slided out so get so animate it back to initial position
{
filterLayout.startAnimation(filterSlideOut);
filterLayout.setVisibility(View.INVISIBLE);
otherLayout.startAnimation(otherSlideIn);
}
else //slide findLayout Out and filterLayout In
{
otherLayout.startAnimation(otherSlideOut);
filterLayout.setVisibility(View.VISIBLE);
filterLayout.startAnimation(filterSlideIn);
}
}
@Override
public void onAnimationEnd(Animation animation)
{
if(isOtherSlideOut) //Now here we will actually move our view to the new position,because animations just move the pixels not the view
{
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(otherLayoutWidth, otherLayoutHeight);
otherLayout.setLayoutParams(params);
isOtherSlideOut = false;
}
else
{
margin = (deviceWidth * 70) / 100; //here im coverting device percentage width into pixels, in my other_slide_in.xml or other_slide_out.xml you can see that i have set the android:toXDelta="80%",so it means the layout will move to 80% of the device screen,to work across all screens i have converted percentage width into pixels and then used it
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(otherLayoutWidth, otherLayoutHeight);
params.leftMargin = margin;
params.rightMargin = -margin; //same margin from right side (negavite) so that our layout won't get shrink
otherLayout.setLayoutParams(params);
isOtherSlideOut = true;
dimOtherLayout();
}
}
@Override
public void onAnimationRepeat(Animation animation)
{
}
@Override
public void onAnimationStart(Animation animation)
{
}
private void dimOtherLayout()
{
AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.5f);
alphaAnimation.setFillAfter(true);
otherLayout.startAnimation(alphaAnimation);
}
}
InventoryActivity.java
public class InventoryActivity extends AppCompatActivity implements View.OnClickListener {
RelativeLayout filterLayout, findLayout;
FilterAnimation filterAnimation;
FloatingActionButton bffilter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_inventory);
assert getSupportActionBar() != null;
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
filterLayout = (RelativeLayout)findViewById(R.id.filter_layout);
findLayout = (RelativeLayout)findViewById(R.id.backLayout);
bffilter = (FloatingActionButton)findViewById(R.id.button_bt_float_wave_color);
bffilter.setOnClickListener(this);
filterAnimation = new FilterAnimation(this);
initializeAnimations();
}
private void initializeAnimations(){
final ViewTreeObserver filterObserver = filterLayout.getViewTreeObserver();
filterObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@TargetApi(Build.VERSION_CODES.JELLY_BEAN)
@Override
public void onGlobalLayout() {
filterLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
int deviceWidth = displayMetrics.widthPixels;
int filterLayoutWidth = (deviceWidth * 70) / 100;
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(filterLayoutWidth, RelativeLayout.LayoutParams.MATCH_PARENT);
filterLayout.setLayoutParams(params);
filterAnimation.initializeFilterAnimations(filterLayout);
}
});
final ViewTreeObserver findObserver = findLayout.getViewTreeObserver();
findObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@TargetApi(Build.VERSION_CODES.JELLY_BEAN)
@Override
public void onGlobalLayout() {
findLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
filterAnimation.initializeOtherAnimations(findLayout);
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_inventory, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == android.R.id.home) {
this.finish();
onBackPressed();
return true;
}
return super.onOptionsItemSelected(item);
}
@Override
public void onClick(View v) {
int id = v.getId();
switch (id){
case R.id.button_bt_float_wave_color:
filterAnimation.toggleSliding();
break;
}
}
}
filter_slide_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator">
<translate
android:fromXDelta="130%"
android:toXDelta="30%"
android:duration="1000" />
</set>
filter_slide_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator">
<translate
android:fromXDelta="30%"
android:toXDelta="130%"
android:duration="1000"/>
</set>
other_slide_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator">
<translate
android:fromXDelta="-70%"
android:toXDelta="30%"
android:duration="1000"
android:fillEnabled="true"/>
</set>
other_slide_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator" >
<translate
android:fromXDelta="30%"
android:toXDelta="-70%"
android:duration="1000"/>
</set>
我的问题:我想如何设置右侧面板以显示和当再次单击时,它消失了。只是我我要删除面板的这段代码转到屏幕截图的左侧。
My Question : How I want to set right side panel to display and when click again it goes away. simply I my this code I want to remove the panel goes to full left see in the screenshot. the other part working fine.
ScreenShot:
预先感谢。
推荐答案
我认为我找到了解决方案。我正在创建新项目。
I think I found the Solution. I am Creating the new Project.
Sliding.java
public class Sliding extends LinearLayout
{
private Paint innerPaint, borderPaint ;
public Sliding(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public Sliding(Context context) {
super(context);
init();
}
private void init() {
innerPaint = new Paint();
innerPaint.setARGB(0, 255, 255, 255); //gray
innerPaint.setAntiAlias(true);
borderPaint = new Paint();
borderPaint.setARGB(255, 255, 255, 255);
borderPaint.setAntiAlias(true);
borderPaint.setStyle(Paint.Style.STROKE);
borderPaint.setStrokeWidth(2);
}
public void setInnerPaint(Paint innerPaint) {
this.innerPaint = innerPaint;
}
public void setBorderPaint(Paint borderPaint) {
this.borderPaint = borderPaint;
}
@Override
protected void dispatchDraw(Canvas canvas) {
RectF drawRect = new RectF();
drawRect.set(0,0, getMeasuredWidth(), getMeasuredHeight());
canvas.drawRoundRect(drawRect, 5, 5, innerPaint);
canvas.drawRoundRect(drawRect, 5, 5, borderPaint);
super.dispatchDraw(canvas);
}
}
Sliding2Activity.java
public class Sliding2Activity extends Activity {
CheckBox c1,c2,c3;
int key=0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_sliding2);
final Sliding popup = (Sliding) findViewById(R.id.sliding1);
popup.setVisibility(View.GONE);
final FloatingActionButton btn=(FloatingActionButton)findViewById(R.id.show1);
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
if (key == 0) {
key = 1;
popup.setVisibility(View.VISIBLE);
} else if (key == 1) {
key = 0;
popup.setVisibility(View.GONE);
}
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_sliding2, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
activity_sliding2.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="right"
android:orientation="horizontal">
<com.rey.material.widget.FloatingActionButton
android:id="@+id/show1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
style="@style/LightFABWaveColor"
android:layout_margin="8dp"
android:layout_gravity="bottom" />
<com.example.softeng.panel.Sliding
android:id="@+id/sliding1"
android:layout_width="250dp"
android:layout_height="match_parent"
android:background="#0072BA"
android:gravity="left"
android:orientation="vertical"
android:padding="1px">
<CheckBox
android:id="@+id/check1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option1"
android:textColor="#FFFFFF" />
<CheckBox
android:id="@+id/check2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option2"
android:textColor="#FFFFFF" />
<CheckBox
android:id="@+id/check3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option3"
android:textColor="#FFFFFF" />
</com.example.softeng.panel.Sliding>
</LinearLayout>
ScreenShot:
运行活动时的正常屏幕。
Normal screen when Activity is running.
点击 FloatinActionButton 时。布局已更改。
单击再次输出是屏幕一。
When you click again the output is screen one.
这篇关于SlidingPanelLayout在android中从右到左效果不佳的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!