很多应用为了节省空间而又使界面能够充足的显示信息,大多数应用都采用了侧边栏的方式,如下图:

948e41b0bad6c0e1386c7a1ecd872e44.png

109b90439bf203d24576eb32d7cd504e.png

来说说它的思路,底下是两个或多个视图,分别通过控制它们的宽度、左边距来控制它们的显示,来看看代码

activity_main.xml

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/layout"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="horizontal"

tools:context=".MainActivity" >

android:id="@+id/menu"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="@drawable/menu" >

android:id="@+id/content"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="@drawable/content" >

MainActivity.java

public class MainActivity extends Activity implements OnTouchListener

{

private LinearLayout menu;

private LinearLayout content;

private LayoutParams menuParams;

private LayoutParams contentParams;

// menu完全显示时,留给content的宽度值。

private static final int menuPadding = 80;

// 分辨率

private int disPlayWidth;

private float xDown;

private float xMove;

private boolean mIsShow = false;

private static final int speed = 50;

@Override

protected void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_main);

disPlayWidth = getWindowManager().getDefaultDisplay().getWidth();

menu = (LinearLayout) findViewById(R.id.menu);

content = (LinearLayout) findViewById(R.id.content);

menuParams = (LayoutParams) menu.getLayoutParams();

contentParams = (LayoutParams) content.getLayoutParams();

findViewById(R.id.layout).setOnTouchListener(this);

menuParams.width = disPlayWidth - menuPadding;

contentParams.width = disPlayWidth;

showMenu(mIsShow);

}

@Override

public boolean onTouch(View v, MotionEvent event)

{

switch (event.getAction())

{

case MotionEvent.ACTION_DOWN:

showMenu(!mIsShow);

break;

case MotionEvent.ACTION_MOVE:

break;

case MotionEvent.ACTION_UP:

break;

}

return true;

}

private void showMenu(boolean isShow)

{

if (isShow)

{

mIsShow = true;

menuParams.leftMargin = 0;

} else

{

mIsShow = false;

menuParams.leftMargin = 0 - menuParams.width;

}

menu.setLayoutParams(menuParams);

}

}

上述代码只是用两张图片代替了两个复杂的view(layout),你会发现,两个视图虽然可以切换,但没有动画的感觉,再加上要有拖动效果,所以,我们再给它加个平移时间段,看起来有动画的效果

package com.example.test;

import android.app.Activity;

import android.os.AsyncTask;

import android.os.Bundle;

import android.util.Log;

import android.view.MotionEvent;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.View.OnTouchListener;

import android.view.Window;

import android.widget.LinearLayout;

import android.widget.LinearLayout.LayoutParams;

public class MainActivity extends Activity implements OnTouchListener, OnClickListener

{

private LinearLayout menu;

private LinearLayout content;

private LayoutParams menuParams;

private LayoutParams contentParams;

// menu完全显示时,留给content的宽度值。

private static final int menuPadding = 80;

// 分辨率

private int disPlayWidth;

private float xDown;

private float xMove;

private boolean mIsShow = false;

private static final int speed = 50;

@Override

protected void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_main);

disPlayWidth = getWindowManager().getDefaultDisplay().getWidth();

menu = (LinearLayout) findViewById(R.id.menu);

menu.setOnClickListener(this);

content = (LinearLayout) findViewById(R.id.content);

content.setOnClickListener(this);

menuParams = (LayoutParams) menu.getLayoutParams();

contentParams = (LayoutParams) content.getLayoutParams();

//findViewById(R.id.layout).setOnTouchListener(this);

menuParams.width = disPlayWidth - menuPadding;

contentParams.width = disPlayWidth;

showMenu(mIsShow);

}

@Override

public void onClick(View v)

{

switch (v.getId())

{

case R.id.menu:

new showMenuAsyncTask().execute(-50);

break;

case R.id.content:

new showMenuAsyncTask().execute(50);

break;

}

}

@Override

public boolean onTouch(View v, MotionEvent event)

{

switch (event.getAction())

{

case MotionEvent.ACTION_DOWN:

showMenu(!mIsShow);

break;

case MotionEvent.ACTION_MOVE:

break;

case MotionEvent.ACTION_UP:

break;

}

return true;

}

private void showMenu(boolean isShow)

{

if (isShow)

{

mIsShow = true;

menuParams.leftMargin = 0;

} else

{

mIsShow = false;

menuParams.leftMargin = 0 - menuParams.width;

}

menu.setLayoutParams(menuParams);

}

/**

*

*这是主要代码:模拟动画过程,也让我更熟悉了AsyncTask这玩意儿

*

*/

class showMenuAsyncTask extends AsyncTask

{

@Override

protected Integer doInBackground(Integer... params)

{

int leftMargin = menuParams.leftMargin;

//这里也是值得学习的地方,如果在平常,自己肯定又是这样写:

// if(){

// while()

// }

// else if(){

// while()

// }

while (true)

{

leftMargin += params[0];

if (params[0] > 0 && leftMargin >= 0)

{

break;

} else if (params[0] < 0 && leftMargin <= -menuParams.width)

{

break;

}

publishProgress(leftMargin);

try

{

Thread.sleep(30);

} catch (InterruptedException e)

{

e.printStackTrace();

}

}

return leftMargin;

}

@Override

protected void onProgressUpdate(Integer... values)

{

super.onProgressUpdate(values);

menuParams.leftMargin = values[0];

menu.setLayoutParams(menuParams);

}

@Override

protected void onPostExecute(Integer result)

{

super.onPostExecute(result);

menuParams.leftMargin = result;

menu.setLayoutParams(menuParams);

}

}

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐