I am trying to implement marquee effect to the layout to help it scroll/animate from right inner side to left inner side just as the ticker view.
From the below two links, you would be able to get more knowledge just as stock markets keep users updated by showing the values in a circular constant way.
1) http://www.sify.com/finance/livemarkets/
2) http://terminal.moneycontrol.com/index.php?wl=indices
For this i have implemented below code to make somewhat similar.
public class HorizonalSlideActivity extends Activity
{
private LinearLayout horizontalOuterLayout;
private HorizontalScrollView horizontalScrollview;
private int scrollMax;
private int scrollPos = 0;
private TimerTask scrollerSchedule;
private Timer scrollTimer = null;
private ScrollAdapter adapter = null;
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.horizontal_layout);
adapter = new ScrollAdapter(HorizonalSlideActivity.this);
horizontalScrollview = (HorizontalScrollView) findViewById(R.id.horiztonal_scrollview_id);
horizontalScrollview.setOnTouchListener(new OnTouchListener()
{
@Override
public boolean onTouch(View v, MotionEvent event)
{
return false;
}
});
horizontalOuterLayout = (LinearLayout) findViewById(R.id.horiztonal_outer_layout_id);
horizontalTextView = (TextView) findViewById(R.id.horizontal_textview_id);
horizontalScrollview.setHorizontalScrollBarEnabled(false);
addData();
ViewTreeObserver vto = horizontalOuterLayout.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener()
{
@Override
public void onGlobalLayout()
{
horizontalOuterLayout.getViewTreeObserver().removeGlobalOnLayoutListener(this);
getScrollMaxAmount();
startAutoScrolling();
}
});
}
private void addData()
{
for (int i = 0; i < adapter.getCount(); i++)
{
View convertView = adapter.getView(i, null, null);
horizontalOuterLayout.addView(convertView);
}
}
public void getScrollMaxAmount()
{
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int width = size.x;
Log.e("getScrollMaxAmount", "getWidth == "+width);
Log.e("getScrollMaxAmount", "getMeasuredWidth == "+horizontalOuterLayout.getMeasuredWidth());
int actualWidth = (horizontalOuterLayout.getMeasuredWidth() - width);
Log.e("getScrollMaxAmount", "actualWidth == "+actualWidth);
scrollMax = actualWidth;
Log.e("getScrollMaxAmount", "scrollMax == "+scrollMax);
}
public void startAutoScrolling()
{
if (scrollTimer == null)
{
scrollTimer = new Timer();
final Runnable TimerTick = new Runnable()
{
public void run()
{
moveScrollView();
}
};
if (scrollerSchedule != null)
{
scrollerSchedule.cancel();
scrollerSchedule = null;
}
scrollerSchedule = new TimerTask()
{
@Override
public void run()
{
runOnUiThread(TimerTick);
}
};
scrollTimer.schedule(scrollerSchedule, 3000, 30);
}
}
public void moveScrollView()
{
Log.e("moveScrollView", "scrollMax == "+scrollMax);
scrollPos = (int) (horizontalScrollview.getScrollX() + 1.0);
Log.e("moveScrollView", "scrollPos == "+scrollPos);
if (scrollPos >= scrollMax)
{
scrollPos = 0;
}
horizontalScrollview.scrollTo(scrollPos, 0);
}
public void stopAutoScrolling()
{
if (scrollTimer != null)
{
scrollTimer.cancel();
scrollTimer = null;
}
}
public void onBackPressed()
{
super.onBackPressed();
finish();
}
public void onPause()
{
super.onPause();
finish();
}
public void onDestroy()
{
clearTimerTaks(scrollerSchedule);
clearTimers(scrollTimer);
scrollerSchedule = null;
scrollTimer = null;
super.onDestroy();
}
private void clearTimers(Timer timer)
{
if (timer != null)
{
timer.cancel();
timer = null;
}
}
private void clearTimerTaks(TimerTask timerTask)
{
if (timerTask != null)
{
timerTask.cancel();
timerTask = null;
}
}
}
Here is the layout for this file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<HorizontalScrollView
android:id="@+id/horiztonal_scrollview_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fadingEdge="none" >
<LinearLayout
android:id="@+id/horiztonal_outer_layout_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ffffff"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingBottom="5dip"
android:paddingTop="5dip" >
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
Adapter class to show data:
public class ScrollAdapter extends BaseAdapter
{
private Context context;
public ScrollAdapter(Context context)
{
this.context = context;
}
@Override
public int getCount()
{
return 10;
}
@Override
public Object getItem(int position)
{
return position;
}
@Override
public long getItemId(int position)
{
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent)
{
LayoutInflater inflater = ((Activity)context).getLayoutInflater();
convertView = inflater.inflate(R.layout.scroll_child, null);
return convertView;
}
}
And its xml file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/txtPercent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:text="0.14%" />
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="@android:color/white" />
<TextView
android:id="@+id/txtData"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:text="data" />
</LinearLayout>
By implementing this, i somewhat reached nearer but could not make what is desired. Please help me to make it circular without any interruption and restart scrolling after the last data moves inside from left side.
Here is the desired result:
Also i have checked this link, it gives the scroll effect what is needed but does not shows the whole data, its shows only 3 to 4 views but as you can see i have added 10 data in adapter class.
Any sort of help would be appreciable.
Thanks in advance.