Android - HorizontalScrollView scrolls to the right when keyboard is opened - android

I have a general layout for my app in place, which includes a horizontal scroll view.
What I'm doing is adding 32 fragments to the scroll view (which inflates into a vertical linear layout with two buttons and an editText. They're going to be controls for an equalizer).
The problem is, when I try to edit one of the editText's, the scrollview scrolls all the way to the right - so you're unable to see what you're typing into, and have to scroll all the way back to that entry to view it.
Here's the main xml layout. It splits the screen up into 4 quadrants, with the horizontal scroll view going in the bottom right:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="horizontal"
tools:context=".MainActivity"
android:focusable="true"
android:focusableInTouchMode="true">
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:padding="4dp"
android:orientation="vertical"
android:layout_weight="2"
>
<TextView android:text="Hello World!" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4"
android:padding="4dp"
android:orientation="vertical"
android:background="#FF0000"
>
<TextView android:text="Hello World!" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<HorizontalScrollView
android:id="#+id/hsv_eqControls"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="2dp"
android:background="#FFFFFF"
android:descendantFocusability="beforeDescendants"
android:focusable="true"
android:focusableInTouchMode="true"
>
<LinearLayout
android:id="#+id/layout_eqControls"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
</LinearLayout>
And this is what I'm adding into the scrollview
<?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:padding="3dp"
android:orientation="vertical">
<Button
android:id="#+id/btn_eqUp"
android:layout_width="60dp"
android:layout_height="60dp" />
<EditText
android:id="#+id/etext_eq"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:inputType="numberDecimal|numberSigned"
android:textAlignment="center"
android:layout_gravity="center_horizontal"
android:background="#EEEEEE"
android:hint="32dB"/>
<Button
android:id="#+id/btn_eqDown"
android:layout_width="60dp"
android:layout_height="60dp" />
<TextView
android:id="#+id/vtext_eqLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAlignment="center"
android:layout_gravity="center"
android:text="1"/>
</LinearLayout>
This is the code I'm running to fill the scrollview:
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// View eqControls = findViewById(R.id.hsv_eqControls);
FragmentTransaction ft = getFragmentManager().beginTransaction();
for(int i = 1; i < 33; i++)
{
ft.add(R.id.layout_eqControls, new FragmentEQ(), "ch"+i);
}
ft.commit();
getFragmentManager().executePendingTransactions();
for(int i = 1; i < 33; i++)
{
FragmentEQ feq = (FragmentEQ) getFragmentManager().findFragmentByTag("ch"+i);
if(feq != null)
feq.setChannel(i);
}
}
}
And this is the code for my fragment:
public class FragmentEQ extends Fragment {
protected int _channel = 0;
protected ViewGroup _parent;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState)
{
// Inflate the layout for this fragment
View view = inflater.inflate(R.layout.activity_fragment_eq, container, false);
TextView label = (TextView) view.findViewById(R.id.vtext_eqLabel);
label.setText(Integer.toString(_channel));
return view;
}
public int getChannel() { return _channel; }
public void setChannel(int i)
{
_channel = i;
}
}
I've tried creating a custom HorizontalScrollView, and overriding scrollTo() and onRequestFocusInDescendants() as blank methods that do nothing, but this changes nothing.
public class EQScrollView extends HorizontalScrollView {
public EQScrollView( Context context, AttributeSet attrs)
{
super(context, attrs);
setSmoothScrollingEnabled(false);
}
#Override
public void scrollTo(int x, int y)
{
}
#Override
public boolean onRequestFocusInDescendants(int x, Rect y)
{
return false;
}
}

Using "setRawInputType":
setRawInputType(InputType.TYPE_CLASS_NUMBER);
solved the issue for me at first. After realizing that some number keyboards don't provide decimal input I ended up using standard text input for EditText, extending HorizontalScrollView and overriding "onRequestFocusInDescendants", "requestChildRectangleOnScreen" and "getFocusables" like so:
public class HorizontalScrollViewEx extends HorizontalScrollView {
public HorizontalScrollViewEx(Context context) {
super(context);
}
public HorizontalScrollViewEx(Context context, AttributeSet attrs) {
super(context, attrs);
}
public HorizontalScrollViewEx(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public HorizontalScrollViewEx(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
#Override
protected boolean onRequestFocusInDescendants(int direction, Rect previouslyFocusedRect) {
return true;
}
#Override
public boolean requestChildRectangleOnScreen(View child, Rect rectangle, boolean immediate) {
return true;
}
#Override
public ArrayList<View> getFocusables(int direction) {
return new ArrayList<View>();
}
}

I have just encountered this problem and for me the scrolling to the end only happens when android:inputType is not set in the EditText. If you remove this then the issue should vanish.
FYI even using .setInputType(InputType.TYPE_CLASS_NUMBER); produces this error.
Admittedly this isn't a fix but it's worth noting the cause.

HorizontalScrollView always scroll to the right when I try to click the EditText
I have fixed the similar by the way below:
In my scenario
<HorizontalScrollView
android:id="#+id/id_HorizontalScrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/border_left_black_bold">
<android.support.v7.widget.RecyclerView
android:id="#+id/id_RecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</HorizontalScrollView>
RecyclerView's item view:
<LinearLayout>
<EditText
android:id="#+id/id_edit"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/border_right_black"
android:gravity="center"
android:inputType="number" />
<LinearLayout/>
Solution in my way:
Customize HorizontalScrollView and override the requestChildRectangleOnScreen method
#Override
public boolean requestChildRectangleOnScreen(View child, Rect rectangle, boolean immediate) {
return true;
}
#Override
protected int computeScrollDeltaToGetChildRectOnScreen(Rect rect) {
return 0;
}
root causes
Let's back to the Android source code.
when the soft keyboard pop up. the size of layout changed View.java protected void onLayout(boolean changed, int left, int top, int right, int bottom)
/**
* Called from layout when this view should
* assign a size and position to each of its children.
* ....
*/
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
}
Then HorizontalScrollView.java protected void onLayout(boolean changed, int left, int top, int right, int bottom)
In this method, mIsLayoutDirty = false;
HorizontalScrollView.java public void requestChildFocus(View child, View focused)
HorizontalScrollView.java private void scrollToChild(View child)
HorizontalScrollView.java
int scrollDelta = computeScrollDeltaToGetChildRectOnScreen(mTempRect);
if(scrollDelta!=0){
scrollBy(scrollDelta, 0);
}

Related

Adding buttons dynamically to custom FrameLayout

I have the following XML file that is built out of a custom layout that is created via Java code and 3 buttons inside a linear layout below it -
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:background="#color/grey_200"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/toolbar" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/grey_200"
android:gravity="center_vertical"
android:orientation="vertical"
tools:layout_height="500dp">
<com.etiennelawlor.tinderstack.ui.TinderStackLayout
android:id="#+id/activity_main_tinder_stack_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:padding="5dp">
<Button
android:layout_width="wrap_content"
android:id="#+id/activity_main_delete_button"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#ff0000"
android:tag="1"
android:text="#string/activity_main_delete" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/activity_main_pass_button"
android:layout_margin="10dp"
android:background="#A9A9A9"
android:tag="2"
android:text="#string/activity_main_pass" />
<Button
android:layout_width="wrap_content"
android:id="#+id/activity_main_approve_button"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="#98FB98"
android:tag="3"
android:text="#string/activity_main_approve" />
</LinearLayout>
</LinearLayout>
The issue I am facing looks like this -
I want the image to be able to move on top of the buttons when touching it, but also of course for the buttons to be touchable and functional.
Here is my TinderStackLayout class -
public class TinderStackLayout extends FrameLayout {
// Constants
private static final int DURATION = 300;
// Variable members
private OnCardSwipedListener onCardSwipedListener;
private int screenWidth;
private int yMultiplier;
//Top card
private TinderCardView topCardOnStack;
private Button mDeleteButton, mPassButton, mApproveButton;
//Constructors
public TinderStackLayout(Context context) {
super(context);
init();
}
public TinderStackLayout(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public TinderStackLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
#Override
public void addView(View child, int index, ViewGroup.LayoutParams params) {
super.addView(child, index, params);
if (onCardSwipedListener != null)
onCardSwipedListener.onNext(getChildCount());
}
#Override
public void removeView(View view) {
super.removeView(view);
if (onCardSwipedListener != null)
onCardSwipedListener.onNext(getChildCount());
}
#Override
public void onDetachedFromWindow() {
super.onDetachedFromWindow();
}
// Helper Methods
private void init() {
setClipChildren(false);
screenWidth = DisplayUtility.getScreenWidth(getContext());
yMultiplier = DisplayUtility.dp2px(getContext(), 8);
mDeleteButton = new Button(getContext());
mPassButton = new Button(getContext());
mApproveButton = new Button(getContext());
}
public void addCard(TinderCardView tinderCardView) {
View firstCard = getChildAt(0);
if (firstCard != null && firstCard.equals(tinderCardView)) {
return;
}
if (onCardSwipedListener == null)
onCardSwipedListener = tinderCardView.getOnCardSwipedListener();
topCardOnStack = tinderCardView;
ViewGroup.LayoutParams layoutParams;
layoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
int childCount = getChildCount();
addView(tinderCardView, 0, layoutParams);
float scaleValue = 1 - (childCount / 50.0f);
tinderCardView.animate()
.x(0)
.y(childCount * yMultiplier)
.scaleX(scaleValue)
.setInterpolator(new AnticipateOvershootInterpolator())
.setDuration(DURATION);
}
public TinderCardView getTopCardOnStack() {
return topCardOnStack;
}
}
Do I need to add them dynamically? or is there a simpler way?
And if I do need to add them dynamically - I would be happy to get a code example of how to do so.

ListView collapse in CustomScrollView

Hello I am new in Android development, and I've read various threads which talked about the fact that a ListView should not be inside a Scrollview and need to wrap in linear or relative layout.
But I have a this layout
<com.itmind.spac.spacapp.custom_extends.CustomScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/scrollViewreceipt"
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/include1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/toolbar" />
<Spinner
android:id="#+id/customers_spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:theme="#android:style/Theme.Holo.Light.DarkActionBar"
/>
<Spinner
android:id="#+id/venues_spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:theme="#android:style/Theme.Holo.Light.DarkActionBar"
/>
<Spinner
android:id="#+id/workgroup_spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:theme="#android:style/Theme.Holo.Light.DarkActionBar"
/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="150dp">
<ListView
android:id="#+id/activityList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="15dp"
android:minHeight="150dp"
/>
</LinearLayout >
<android.gesture.GestureOverlayView
android:id="#+id/signaturePad"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_weight="5"
android:background="#d3d3d3"
android:eventsInterceptionEnabled="true"
android:fadeEnabled="false"
android:gestureColor="#333"
android:gestureStrokeLengthThreshold="0.1"
android:gestureStrokeType="multiple"
android:fadeOffset="5000"
android:orientation="vertical" >
</android.gesture.GestureOverlayView>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="testImage"
android:text="testami"/>
</LinearLayout>
And this is my custoScrollView
public class CustomScrollView extends ScrollView {
private boolean enableScrolling = true;
public boolean isEnableScrolling() {
return enableScrolling;
}
public void setEnableScrolling(boolean enableScrolling) {
this.enableScrolling = enableScrolling;
}
public CustomScrollView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public CustomScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomScrollView(Context context) {
super(context);
}
#Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
if (isEnableScrolling()) {
return super.onInterceptTouchEvent(ev);
} else {
return false;
}
}
#Override
public boolean onTouchEvent(MotionEvent ev) {
if (isEnableScrolling()) {
return super.onTouchEvent(ev);
} else {
return false;
}
}
}
I need customclass scroll view beacause I can set enable scroll when i touch on
so in my activity that implements GestureOverlayView.OnGestureListener I have:
#Override
public void onGestureStarted(GestureOverlayView overlay, MotionEvent event) {
myScrollView.setEnableScrolling(false);
}
#Override
public void onGestureEnded(GestureOverlayView overlay, MotionEvent event) {
myScrollView.setEnableScrolling(true);
}
So many elements and I need to scrollView for view all elements.
Inside my scrollView I have a listView that I populate with data retrieve from db.
My problem is that my Listview collapse, that shows one line and I see and scroll in one row.
I tried with min-height but doesn't work, and if I put a layout height in Listview, I cant scroll this list.
How can I do this?
I would a list View in a long page so I have to use scrollview or are there solutions?
Below given custom ListView class will make height of your Listview based on its content inside ScrollView. Use it instead of ListView in your xml-layout file same way you use your CustomScrollView.
public class CustomListView extends ListView {
// private boolean expanded;
public CustomListView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomListView(Context context) {
super(context);
}
public CustomListView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2,
MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
}
}
Hope this will help you.
Note :- As per this link of Android developer website, We should never use a ScrollView with a ListView, because ListView takes care of its own vertical scrolling.

How to make a list of square buttons with autoresize?

I am developing an app that displays a page with a variable number of square buttons, like the second picture of "Square MIUI":
Square MIUI on APP store
I need displaying only three columns of square buttons, and make the entire list scrollable.
I'm trying first with plain XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical" >
<ScrollView
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1.19"
android:orientation="horizontal" >
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<TableRow
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Title"/>
</TableRow>
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<!-- Icon buttons here -->
</TableRow>
</TableLayout>
</ScrollView>
<Button
android:layout_width="fill_parent"
android:layout_height="48dp"
android:text="Button" />
</LinearLayout>
For every button (4 TableRow of 3 buttons, images are square .png made with Eclipse icon generator)
EDIT: checked, icons of all screen densities are square
<Button
android:layout_margin="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="image"/>
but the buttons on my tablet are square, and on my phone are wider than tall (stretched on X-axis).
What I'm doing wrong?
TODO: code a variable button number.
Thanks in advance.
EDIT:
I tried this code:
private void squareButton() {
square(R.id.b1);
square(R.id.b2);
....
square(R.id.b<N>);
}
private void square(int id) {
ImageButton temp=(ImageButton) findViewById(id);
int l=temp.getWidth();
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int Measuredwidth = metrics.widthPixels;
l=(int) (Measuredwidth/4);
temp.setMaxWidth(l);
temp.setMaxHeight(l);
temp.setMinimumWidth(l);
temp.setMinimumHeight(l);
LayoutParams param = temp.getLayoutParams();
param.width = l;
param.height = l;
temp.setLayoutParams(param);
temp.requestLayout();
}
But I'm still getting weird buttons on phone (Gingerbread)...
I can't rely only on the auto-sized icons (too little on my tablet, too big on my phone)
EDIT:
I'm looking for a code that:
squares button
has user-definable width
works with Gingerbread
In my case, button_width = widthPixels/4;
Thank you in advance.
Implements you own square button class like this:
public class SquareButton extends Button {
public SquareButton(Context context) {
super(context);
}
public SquareButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareButton(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension(getMeasuredWidth(), getMeasuredWidth()); // Snap to width
}
}
Finally, I found a solution using GridView.
First, I follow the GridView tutorial
Then I got some code from other answers.
Now this code creates a scrollable and clickable big square icon list, resized according to screen size. When one icon is clicked, changes his image.
Thank you Lubos for your suggestion.
[main activity]
public class Grid extends Activity {
public boolean audio=true;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grid);
GridView gridview = (GridView) findViewById(R.id.gridview);
gridview.setAdapter(new ImageAdapter(this));
// load icons on grid
ImageAdapter.loadImages(new Integer[] {
R.drawable.ic_blu_voice_on,
R.drawable.ic_blu_help,
R.drawable.ic_blu_save,
R.drawable.ic_blu_load
});
gridview.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View imgView, int position, long id) {
ImageView image=(ImageView) imgView;
switch (position) {
case 0:
// switch voice icon on/off when clicked
image.setImageResource(voice());
break;
}
Toast.makeText(Grid.this, "" + position, Toast.LENGTH_SHORT).show();
}
});
}
private int voice() {
audio=!audio;
if (audio) return R.drawable.ic_blu_voice_on;
return R.drawable.ic_blu_voice_off;
}
}
[imageadapter.java]
public class ImageAdapter extends BaseAdapter {
private Context mContext;
// reference to images (dummy)
private static Integer[] mThumbIds = {0,0};
private float px;
public ImageAdapter(Context c) {
mContext = c;
//Calculation of ImageView Size - density independent.
Resources r = Resources.getSystem();
px = r.getDisplayMetrics().widthPixels;
px=px/3;
}
public int getCount() {
return mThumbIds.length;
}
public Object getItem(int position) {
return null;
}
public long getItemId(int position) {
return 0;
}
public static void setImage(int position, int id) {
mThumbIds[position]=id;
}
public static void loadImages(Integer[] images) {
mThumbIds = images;
}
// create a new ImageView for each item referenced by the Adapter
public View getView(int position, View convertView, ViewGroup parent) {
ImageView imageView;
if (convertView == null) { // if it's not recycled, initialize some attributes
imageView = new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams((int)px, (int)px));
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
imageView.setPadding(8, 8, 8, 8);
} else {
imageView = (ImageView) convertView;
}
imageView.setImageResource(mThumbIds[position]);
return imageView;
}
}
[activity_grid.xml]
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical"
tools:context="${packageName}.${activityClass}">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context="${relativePackage}.${activityClass}" >
<TextView
android:id="#+id/testo1"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:gravity="center_horizontal"
android:text="#string/hello_world"
android:textSize="30sp" />
<GridView
android:id="#+id/gridview"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:columnWidth="120dp"
android:gravity="center"
android:numColumns="auto_fit"
android:stretchMode="spacingWidthUniform">
</GridView>
<Button
android:id="#+id/button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:textSize="30sp" />
</LinearLayout>
</RelativeLayout>

Views removed/added in layout are not properly redrawn

I'm trying to remove and add views during onLayout in a ViewGroup, but this causes some child views not to properly redraw.
Consider the following view:
public static class MyViewGroup extends ViewGroup {
View view;
int count;
boolean removeInLayout = true;
public MyViewGroup(Context context) {
super(context);
init();
}
public MyViewGroup(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public MyViewGroup(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
private void init() {
view = LayoutInflater.from(getContext()).inflate(R.layout.myview, this, false);
addView(view);
setOnClickListener(new OnClickListener() {
#Override public void onClick(View v) {
count++;
requestLayout();
}
});
}
#Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
if (removeInLayout) {
removeViewInLayout(view);
}
invalidate();
final String text = "Count: " + count;
((TextView) view.findViewById(R.id.one)).setText(text);
((TextView) view.findViewById(R.id.two)).setText(text);
((TextView) view.findViewById(R.id.three)).setText(text);
((TextView) view.findViewById(R.id.four)).setText(text);
if (removeInLayout) {
LayoutParams lp = view.getLayoutParams();
addViewInLayout(view, 0, lp);
final int wms = MeasureSpec.makeMeasureSpec(r - l, MeasureSpec.EXACTLY);
final int hms = MeasureSpec.makeMeasureSpec(lp.height, MeasureSpec.EXACTLY);
view.measure(wms, hms);
}
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
}
#Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(MeasureSpec.getSize(widthMeasureSpec),
MeasureSpec.getSize(heightMeasureSpec));
measureChild(view, widthMeasureSpec, heightMeasureSpec);
}
}
With the following xml layout as a child:
<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="84dp">
<TextView
android:id="#+id/one"
android:layout_width="100dp"
android:layout_height="84dp"
android:background="#FF00FF00"
tools:text="First View"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/one"
android:layout_toLeftOf="#+id/four"
android:layout_centerVertical="true"
android:layout_marginLeft="4dp"
android:paddingBottom="2dp"
android:orientation="vertical">
<TextView
android:id="#+id/two"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceMedium"
tools:text="Second View"/>
<TextView
android:id="#+id/three"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:fontFamily="sans-light"
android:maxLines="3"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textSize="12sp"
tools:text="Third View"/>
</LinearLayout>
<TextView
android:id="#+id/four"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="4dp"
android:layout_marginLeft="4dp"
tools:text="Fourth view"/>
</RelativeLayout>
Initially the view and its children draw just fine, and on the first click every view is redrawn as well. Any further clicks will only cause the views with id "one" and "four" to be redrawn. "two" and "three" becomes stuck.
If I remove the invalidate() from onLayout the views are never redrawn.
If I swap out the removeViewInLayout and addViewInLayout with detachViewFromParent and attachViewToParent the views are properly redrawn. If I remove the invalidate they are never redrawn.
Can anyone shed some light on what is happening? Should it not be possible to remove and re-add a view during the layout phase? And why isn't the fact that the child view is invalidated, although while detached, enough to cause a redraw?
I have uploaded a sample app to https://github.com/SimonVT/add-in-layout - click anywhere on the screen to fire the OnClickListener which increments the count variable and requests a layout.

How to set images for ScrollView instead-of fading edges?

I am using Horizontal Scroll View, dynamically i will add items in to that. if no. of items are more than displaying items on the screen i want to show image(arrow) at the edges ( like scroll view shows fading edges). How can i do it.
just look at below image, i want create like that.
this is the xml code
<HorizontalScrollView
android:layout_width="wrap_content"
android:scrollbars="none"
android:id="#+id/app_category"
android:layout_below="#+id/top_layout"
android:background="#drawable/minitopbar"
android:layout_height="30dp">
<LinearLayout
android:orientation="horizontal"
android:id="#+id/app_category_scroll_layout"
android:layout_width="wrap_content"
android:layout_height="fill_parent"/>
</HorizontalScrollView>
A. You have to create your own class, that extends HorizontalScrollView:
public class ExtendedHorizontalScrollView extends HorizontalScrollView {
private IScrollStateListener scrollStateListener;
public HorizontalScrollViewForMenu(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public HorizontalScrollViewForMenu(Context context, AttributeSet attrs) {
super(context, attrs);
}
public HorizontalScrollViewForMenu(Context context) {
super(context);
}
#Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
prepare();
}
private void prepare() {
if (scrollStateListener != null) {
View content = this.getChildAt(0);
if (content.getLeft() >= 0)
scrollStateListener.onScrollMostLeft();
if (content.getLeft() < 0)
scrollStateListener.onScrollFromMostLeft();
if (content.getRight() <= getWidth())
scrollStateListener.onScrollMostRight();
if (content.getLeft() > getWidth())
scrollStateListener.onScrollFromMostRight();
}
}
#Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if (scrollStateListener != null) {
if (l == 0)
scrollStateListener.onScrollMostLeft();
else if (oldl == 0)
scrollStateListener.onScrollFromMostLeft();
int mostRightL = this.getChildAt(0).getWidth() - getWidth();
if (l >= mostRightL)
scrollStateListener.onScrollMostRight();
if (oldl >= mostRightL && l < mostRightL)
scrollStateListener.onScrollFromMostRight();
}
}
public void setScrollStateListener(IScrollStateListener listener) {
scrollStateListener = listener;
}
public interface IScrollStateListener {
void onScrollMostLeft();
void onScrollFromMostLeft();
void onScrollMostRight();
void onScrollFromMostRight();
}
}
B. Use it defining of layout:
<LinearLayout
.....>
<ImageView
android:id="#+id/navigation_left"
..... />
<your.custom.view.package.ExtendedHorizontalScrollView
android:id="#+id/scroller"
android:layout_width="0px"
android:layout_weight="1"
android:fadingEdge="none"
....>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</your.custom.view.package.ExtendedHorizontalScrollView>
<ImageView
android:id="#+id/navigation_right"
..... />
</LinearLayout>
C. Add logic for disabling arrows when you can't scroll any more.
((ExtendedHorizontalScrollView)findViewById(R.id.scroller)).setScrollStateListener(new IScrollStateListener() {
public void onScrollMostRight() {
((View) scroller.getParent()).findViewById(R.id.navigation_right).setVisibility(View.INVISIBLE);
}
public void onScrollMostLeft() {
((View) scroller.getParent()).findViewById(R.id.navigation_left).setVisibility(View.INVISIBLE);
}
public void onScrollFromMostLeft() {
((View) scroller.getParent()).findViewById(R.id.navigation_left).setVisibility(View.VISIBLE);
}
public void onScrollFromMostRight() {
((View) scroller.getParent()).findViewById(R.id.navigation_right).setVisibility(View.VISIBLE);
}
});
An easy alternative is to make a scrollview without fading edges and then add the image with arrow below or on top of the scrollview.
Your xml something similar:
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:fadingEdge="none"
/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<View
android:layout_height="6dp"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:background="#drawable/background_effect"/>
</RelativeLayout>
</FrameLayout>

Categories

Resources