8

I have a pie chart and mapview on the screen. Between chart and mapview, there is a small imageview. When imageview moves, chart and mapview are supposed to have grow and shrink. It works, but when I move imageview, app is shaking. I want their sizes to change smoothly. I think it is due to pie chart. How can I fix this? Thanks. Here is my Java code : 

final LinearLayout aboveLinear = (LinearLayout) findViewById(R.id.aboveLinear); final LinearLayout belowLinear = (LinearLayout) findViewById(R.id.belowLinear); final ImageView imageView2 = (ImageView) findViewById(R.id.imageView2); detector = new GestureDetectorCompat(this, new GestureDetector.SimpleOnGestureListener() { @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { if ( aboveLinear == null || belowLinear == null ) { return true; } distanceY*=-1; int height = aboveLinear.getHeight ( ) + mapview.getHeight ( ); ViewGroup.LayoutParams layoutParams = aboveLinear.getLayoutParams ( ); if ( ( int ) distanceY + layoutParams.height < minH ) layoutParams.height = minH; else if ( ( int ) distanceY + layoutParams.height > height - minH ) layoutParams.height = height - minH; else layoutParams.height = ( int ) distanceY + layoutParams.height; ViewGroup.LayoutParams layoutParams2 = belowLinear.getLayoutParams ( ); layoutParams2.height = height - layoutParams.height; aboveLinear.setLayoutParams ( layoutParams ); belowLinear.setLayoutParams ( layoutParams2 ); return true; } }); imageView2.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(final View view, final MotionEvent motionEvent) { return detector.onTouchEvent(motionEvent); } }); mapview = (MapView) findViewById(R.id.mapview); mapview.onCreate(savedInstanceState); chart1 = (PieChart) findViewById(R.id.chart1); chart1.setUsePercentValues(true); chart1.setDescription(""); chart1.setExtraOffsets(5, 10, 5, 5); chart1.setDragDecelerationFrictionCoef(0.95f);

Here is my xml code : 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" xmlns:mapbox="http://schemas.android.com/apk/res-auto" android:id="@+id/root"> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:id="@+id/aboveLinear"> <com.github.mikephil.charting.charts.PieChart android:id="@+id/chart1" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentTop="true" android:scaleType="fitXY"/> </LinearLayout> <ImageView android:id="@+id/imageView2" android:layout_width="match_parent" android:layout_height="25dp" android:layout_alignParentTop="true" android:clickable="true" android:scaleType="fitXY" android:src="@drawable/red"/> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:id="@+id/belowLinear"> <com.mapbox.mapboxsdk.maps.MapView android:layout_height="match_parent" android:scaleType="fitXY" android:id="@+id/mapview" android:layout_width="fill_parent" mapbox:access_token="@string/accessToken" mapbox:style_url="@string/style_mapbox_streets" mapbox:center_latitude="41.885" mapbox:center_longitude="-87.679" mapbox:zoom="12" mapbox:tilt="20"/> </LinearLayout> </LinearLayout>
Improve this question
1
  • Had you ever try ValueAnimator ...? It allow you to change the Properties of View smoothly .... Commented Jun 29, 2016 at 5:13

3 Answers 3

Reset to default
5
+100

You dont need animation to do this. Dont calculate height every time. This solution will help you

 private MapView mapview; PieChart chart1; GestureDetectorCompat detector; int minH = 100; int height = 0; private LinearLayout aboveLinear; private LinearLayout belowLinear; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.mappie); aboveLinear = (LinearLayout) findViewById(R.id.aboveLinear); belowLinear = (LinearLayout) findViewById(R.id.belowLinear); final ImageView imageView2 = (ImageView) findViewById(R.id.imageView2); detector = new GestureDetectorCompat(this, new GestureDetector.SimpleOnGestureListener() { @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { if ( aboveLinear == null || belowLinear == null ) { return true; } if(distanceY > 90){ distanceY = 90; } else if(distanceY < -90){ distanceY = -90; } distanceY*=-1; if(height == 0){ height = aboveLinear.getMeasuredHeight()+belowLinear.getMeasuredHeight();// calculate only once } Log.wtf("Mapie","Height :"+height); int toHeightAL, toHeightBl; ViewGroup.LayoutParams layoutParams = aboveLinear.getLayoutParams ( ); if(layoutParams.height == 0){ layoutParams.height = height/2; // params.height returns 0 before setting the value for it } if ( ( int ) distanceY + layoutParams.height < minH ) toHeightAL = minH; else if ( ( int ) distanceY + layoutParams.height > height - minH ) toHeightAL = height - minH ; else toHeightAL = ( int ) distanceY + layoutParams.height; ViewGroup.LayoutParams layoutParams2 = belowLinear.getLayoutParams (); toHeightBl = height - layoutParams.height; layoutParams.height = toHeightAL; layoutParams2.height = toHeightBl; aboveLinear.setLayoutParams ( layoutParams ); belowLinear.setLayoutParams ( layoutParams2 ); return true; } }); imageView2.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(final View view, final MotionEvent motionEvent) { return detector.onTouchEvent(motionEvent); } }); mapview = (MapView) findViewById(R.id.mapview); mapview.onCreate(savedInstanceState); chart1 = (PieChart) findViewById(R.id.chart1); chart1.setUsePercentValues(true); chart1.setDescription(""); chart1.setExtraOffsets(5, 10, 5, 5); chart1.setDragDecelerationFrictionCoef(0.95f); }
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

4

You can try to use an animation for resizing this view. Instead to set height and width equals to a value, maybe you have to animate from starting height/width to the height/width you want to use.

Check here https://stackoverflow.com/a/8162779/6093353. This user wrote a very simple custom animation to resize a view, but you can write the animation you want your own.

Let me know if this helps you!

Improve this answer

2 Comments

Thanks, I prefer using gestures instead of animation. Because they are more realistic.
yeah, ok! So, maybe you can try to draw your view on a canvas and then you can use the scale() method of the Canvas class to resize it during your gesture. Here there is an example developer.android.com/training/gestures/scale.html
3

Try to replace the OnScroll function with this (i didn't tried this, nor typed it in a java IDE so maybe i'm not accessing the properties the right way as i'm more used to C#) :

public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { if (aboveLinear == null || belowLinear == null) { return true; } int currentY = e1.getY(); float ratio = abovelinear.getHeight() / (aboveLinear.Bottom - currentY); aboveLinear.SetScaleY( aboveLinear.GetScaleY()- ratio); belowLinear.SetScaleY(belowLinear.GetScaleY() +ratio); return true; } });

This should work only one way (down to top), but with some time you should be able to obtain what you are looking for.

Improve this answer

5 Comments

I took the code from somewhere, it was working with imageviews but doesn't work with mapview and a chart. So I don't know the code much.
Could you add pictures of what happens and what you want to happen please ? It's hard to me to understand what you want to achieve. From what i understand you want to scale up and down your Chart and your map view when you image view "moves". That's the part i don't get. How is your imageView supposed to move ? Up and down ? Left and right ? In any direction ? Why do you want to resize your Chart and map instead of just pushing them out of screen ?
Okay i think i got it ! If i got it right you want to drag up and down your red line, and this way make your Chart or your Mapview fill the avaible space below and above this line depending on its position. Am i right ?
Correct, if you drag up chart gets smaller, and map gets bigger at the same rate.
I don't ensure you the code i just added will work, i have no way to test it now, it doesn't manage your min and max height parameters, maybe it won't work at all, i don't know ^^

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.