CodeHeat

Installation To implement rotation of an image in Phimp.me,  we have implemented Horizontal Wheel View feature. It is a custom view for user input that models horizontal wheel controller. How did we include this feature using jitpack.io? Step 1:  The jitpack.io repository has to be added to the root build.gradle: allprojects { repositories { jcenter() maven { url "https://jitpack.io" } } } Then, add the dependency to your module build.gradle: compile 'com.github.shchurov:horizontalwheelview:0.9.5' Sync the Gradle files to complete the installation. Step 2: Setting Up the Layout Horizontal Wheel View has to be added to the XML layout file as shown below: <FrameLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="2"> <com.github.shchurov.horizontalwheelview.HorizontalWheelView android:id="@+id/horizontalWheelView" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_toStartOf="@+id/rotate_apply" android:padding="5dp" app:activeColor="@color/accent_green" app:normalColor="@color/black" /> </FrameLayout> It has to be wrapped inside a Frame Layout to give weight to the view. To display the angle by which the image has been rotated, a simple text view has to be added just above it. <TextView android:id="@+id/tvAngle" android:layout_width="match_parent" android:layout_height="0dp" android:layout_gravity="center" android:layout_weight="1" android:gravity="center" android:textColor="@color/black" android:textSize="14sp" /> Step 3: Updating the UI First, declare and initialise objects of HorizontalWheelView and TextView. HorizontalWheelView horizontalWheelView = (HorizontalWheelView) findViewById(R.id.horizontalWheelView); TextView tvAngle= (TextView) findViewById(R.id.tvAngle);   Second, set up listener on the HorizontalWheelView and update the UI accordingly. horizontalWheelView.setListener(new HorizontalWheelView.Listener() { @Override public void onRotationChanged(double radians) { updateText(); updateImage(); } }); updateText() updates the angle and updateImage() updates the image to be rotated. The following functions have been defined below: private void updateText() { String text = String.format(Locale.US, "%.0f°", horizontalWheelView.getDegreesAngle()); tvAngle.setText(text); } private void updateImage() { int angle = (int) horizontalWheelView.getDegreesAngle(); //Code to rotate the image using the variable 'angle' rotatePanel.rotateImage(angle); } rotateImage() is a method of ‘rotatePanel’ which is an object of RotateImageView, a custom view to rotate the image. Let us have a look at some part of the code inside RotateImageView. private int rotateAngle; ‘rotateAngle’ is a global variable to hold the angle by which image has to be rotated. public void rotateImage(int angle) { rotateAngle = angle; this.invalidate(); } The method invalidate() is used to trigger UI refresh and every time UI is refreshed, the draw() method is called. We have to override the draw() method and write the main code to rotate the image in it. The draw() method is defined below: @Override public void draw(Canvas canvas) { super.draw(canvas); if (bitmap == null) return; maxRect.set(0, 0, getWidth(), getHeight());// The maximum bounding rectangle calculateWrapBox(); scale = 1; if (wrapRect.width() > getWidth()) { scale = getWidth() / wrapRect.width(); } canvas.save(); canvas.scale(scale, scale, canvas.getWidth() >> 1, canvas.getHeight() >> 1); canvas.drawRect(wrapRect, bottomPaint); canvas.rotate(rotateAngle, canvas.getWidth() >> 1, canvas.getHeight() >> 1); canvas.drawBitmap(bitmap, srcRect, dstRect, null); canvas.restore(); } private void calculateWrapBox() { wrapRect.set(dstRect); matrix.reset(); // Reset matrix is ​​a unit matrix int centerX = getWidth() >> 1; int centerY = getHeight() >> 1; matrix.postRotate(rotateAngle, centerX, centerY); // After the rotation angle matrix.mapRect(wrapRect); }   And here you go: Resources Refer to Github- Horizontal Wheel View for more functions and for a sample application.