Develop Reference

Android: Resize GIF to cover screen width

I've been searching for a while now to solve this problem. I created my own GIF view. I want to resize this GIF view such that it will cover the screen width, dependent on the screen size of the actual device. I got it working so that the GIF will show in it's actual size, but for the device of my friend, it is portrayed too small. I'm using the Movie class provided by Android.
I tried adjusting the canvas but that didn't work. I also tried multiple things with the onMeasure method but they also didn't work. The closest I got was that the GIF was larger but the window in which it appeared was still the same size as before. The code of the GIF view is down below, alongside with the xml file where it is used.
<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="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#drawable/spacevert"
tools:context="com.wina.hengst.hengstdrinkinggame.Multiplayer" >
<TextView
android:id="#+id/timerTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="74dp"
android:text="#string/be_ready"
android:textSize="50sp"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/linear"
android:layout_below="#id/timerTextView"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<com.wina.hengst.hengstdrinkinggame.GIF
android:id="#+id/gif"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/linear"
android:layout_centerHorizontal="true"
android:textSize="50sp"
android:gravity="center" />
<SeekBar
android:id="#+id/sliderMulti"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<CheckBox
android:id="#+id/hiddenMulti"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_above="#id/sliderMulti"
android:text="#string/hidden"
android:textSize="25sp"
android:checked="true" />
<TextView
android:id="#+id/progress"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/sliderMulti"
android:textSize="25sp"
/>
<Button
android:id="#+id/startMulti"
android:text="#string/start"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_below="#id/progress"
android:background="#color/Hengstgroen"
android:layout_centerHorizontal="true"
android:layout_marginTop="15dp"/>
package com.wina.hengst.hengstdrinkinggame;
import java.io.InputStream;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Movie;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
public class GIF extends View {
private InputStream gifInputStream;
private Movie gifMovie;
private int movieWidth, movieHeight;
private long movieDuration;
private long mMovieStart;
public GIF(Context context) {
super(context);
init(context);
}
public GIF(Context context, AttributeSet attrs) {
super(context, attrs);
init(context);
}
public GIF(Context context, AttributeSet attrs,
int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context);
}
private void init(Context context){
setFocusable(true);
gifInputStream = context.getResources()
.openRawResource(R.drawable.sweetlemonade);
gifMovie = Movie.decodeStream(gifInputStream);
movieWidth = gifMovie.width();
movieHeight = gifMovie.height();
movieDuration = gifMovie.duration();
}
#Override
protected void onMeasure(int widthMeasureSpec,
int heightMeasureSpec) {
setMeasuredDimension(movieWidth, movieHeight);
}
public int getMovieWidth(){
return movieWidth;
}
public int getMovieHeight(){
return movieHeight;
}
public long getMovieDuration(){
return movieDuration;
}
#Override
protected void onDraw(Canvas canvas) {
long now = android.os.SystemClock.uptimeMillis();
if (mMovieStart == 0) { // first time
mMovieStart = now;
}
if (gifMovie != null) {
int dur = gifMovie.duration();
if (dur == 0) {
dur = 1000;
}
int relTime = (int)((now - mMovieStart) % dur);
gifMovie.setTime(relTime);
gifMovie.draw(canvas, 0, 0);
invalidate();
}
}
public void restart() {
mMovieStart = 0;
}
}
Your help would be much appreciated!
EDIT
I found it was too hard to try and solve this problem. I've just converted the gif into multiple images and used an animation xml provided by android. This is something I can resize easily by adjusting the xml with the ImageView. For the conversion I used GIMP and a plugin called export layers. If any of you know the answer, you can always write the answer here and I'll try it.

Try using Glide library, it can put GIFs in ImageViews. You also need to set layout_width in your ImageView to match_parent.
https://github.com/bumptech/glide

TextView is taking Theme color of activity as its background instead of its background image

I have created an Activity and applied Theme with Orange colour. I created a custom View object containing a background image and 2 TextView objects. 1 TextView is on Left side and another is on Right side.
I just placed that custom view as Header view on activity.
Background of TextView must be that background image, but it shows Theme orange color as its background.
My Code:
Header.java:
package com.example.themes;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.LinearLayout;
public class Header extends LinearLayout{
public Header(Context context) {
super(context);
init();
}
public Header(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public Header(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public void init(){
LayoutInflater layInflator = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
layInflator.inflate(R.layout.header_layout, this);
}
}
header_layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/imgView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/action_bar" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="left" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="right" />
</RelativeLayout>
activity_main.xml:
<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="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.themes.MainActivity" >
<com.example.themes.Header
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</RelativeLayout>
MainActivity.java:
package com.example.themes;
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

You have multiple ways to do that
Use android:scaleType="fitXY" or
Use android:background="#drawable/image" instead of android:src
And the best is to remove that ImageView and apply android:background="#drawable/image" on the RelativeLayout

Calculate margins from coordinates in android screen

i have a library to insert floating buttons in a layout (http://prolificinteractive.com/blog/2014/07/24/android-floating-action-button-aka-fab/)
Then, i have this layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fontawesometext="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginTop="32dp"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp">
<com.beardedhen.androidbootstrap.FontAwesomeText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="4dp"
android:textSize="45sp"
android:textColor="#737373"
android:id="#+id/faIcon"
fontawesometext:fa_icon="fa-question" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text='"texto de ejemplo de pregunta"'
android:id="#+id/tvQuestion"
android:textColor="#color/primary"
android:textStyle="bold"
android:textSize="28sp"
android:typeface="monospace"
android:layout_marginLeft="16dp"
android:layout_marginTop="32dp"
android:layout_marginBottom="16sp" />
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/frameConainter"
android:background="#color/dark_grey" />
</LinearLayout>
And i need to set the center of the button in the middle of framelayout top, like as the left image:
I have this in a custom view:
public class YesNoReplyView extends ReplyParentView {
private FloatingActionButton buttonYes;
private FloatingActionButton buttonNo;
public YesNoReplyView(Context context) {
super(context);
}
public YesNoReplyView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#TargetApi(Build.VERSION_CODES.HONEYCOMB)
public YesNoReplyView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
public void initializeComponents() {
int[] position = new int[2];
getLocationOnScreen(position);
buttonYes = new FloatingActionButton.Builder((Activity)getContext())
.withDrawable(getResources().getDrawable(R.drawable.ic_plus))
.withButtonColor(getResources().getColor(R.color.green_success))
.withGravity(Gravity.BOTTOM | Gravity.RIGHT)
.withMargins(0, 0, 16, 16)
.create();
buttonNo = new FloatingActionButton.Builder((Activity)getContext())
.withDrawable(getResources().getDrawable(R.drawable.ic_plus))
.withButtonColor(getResources().getColor(R.color.primary))
.withGravity(Gravity.BOTTOM | Gravity.RIGHT)
.withMargins(0, 0, 26, 26)
.create();
}
#Override
public String getResult() {
String result = "";
return result;
}
}
But i dont know how can i calculate the margins from the coordinates to set the view in the position i want..
Anyone knows any way better to do it this?(I cant use a XML layout..)

Android--called invalidate() but view does not refresh

Hi I'm doing a practice project which could draw a line with the coordinates I put. The screen only have two textfields and one button. For example if I put "20" and "30" in those two textfields and click the "draw" button, I want the app to draw a line from (0,0) to (20,30) in ANOTHER VIEW. The problem is when I click the button, the values in those two textfields are passed into the setCoordinates() function, but the view just doesn't show the line. I tried change coordinates[0] and coordinates[1] to 50 and 50 in the canvas.drawLine() function then the line shows up, so I guess may be the invalidate() function is not working? Anyway please help find where my problem is, thanks!!!!! Here is my code:
MazeBuilder.java
package com.example.maze;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.app.Activity;
import android.graphics.Color;
public class MazeBuilder extends Activity {
private DrawMaze drawMaze ;
private EditText editTextX;
private EditText editTextY;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
drawMaze = new DrawMaze(this);
setContentView(R.layout.activity_maze_builder);
editTextX = (EditText) findViewById(R.id.editText1);
editTextY = (EditText) findViewById(R.id.editText2);
}
public void buildMaze(View view){
final int x = getValue(editTextX);
final int y = getValue(editTextY);
drawMaze.setCoordinates(x, y);
}
private static int getValue (EditText text) {
try {
return Integer.parseInt(text.getText().toString());
} catch (NumberFormatException ex) {
return 0;
}
}
}
DrawMaze.java
package com.example.maze;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
public class DrawMaze extends View{
private Paint paint = new Paint();
private int[] coordinates = new int[2];
//===============================Constructors==============================================
//
//
public DrawMaze(Context context) {
super( context );
}
public DrawMaze(Context context, AttributeSet attrs) {
super( context, attrs );
}
public DrawMaze(Context context, AttributeSet attrs, int defStyle) {
super( context, attrs, defStyle );
}
//===============================Initialize the color of line and background==========================================
//
//
public void init(){
paint.setColor(Color.BLACK);
this.setBackgroundColor(Color.WHITE);
}
public void setCoordinates(int x, int y){
coordinates[0] = x;
coordinates[1] = y;
invalidate();
}
#Override
protected void onDraw(Canvas canvas) {
System.out.println("=============coordinates[0]:"+coordinates[0]+"================coordinates[1]:"+coordinates[1]+"========");
canvas.drawLine(0, 0, coordinates[0] , coordinates[1] , paint);
}
}
activity_maze_builder.xml
<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="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MazeBuilder" >
<com.example.maze.DrawMaze
android:id="#+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/relativeLayout1" />
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="500dp"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/editText2"
android:layout_alignBottom="#+id/editText2"
android:layout_centerHorizontal="true"
android:text="Columns: "
android:textAppearance="?android:attr/textAppearanceMedium" />
<EditText
android:id="#+id/editText2"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/button1"
android:ems="10" >
<requestFocus />
</EditText>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/editText2"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:onClick="buildMaze"
android:text="Build" />
<EditText
android:id="#+id/editText1"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/textView1"
android:ems="10" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/editText1"
android:layout_alignBottom="#+id/editText1"
android:layout_toLeftOf="#+id/editText1"
android:text="Rows: "
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>

instead of
drawMaze = new DrawMaze(this);
use
drawMaze = (DrawMaze)findViewById(R.id.relativeLayout2);
but under
setContentView()
the reason is that when you set the content view with your layout, it is using the DrawMaze from your layout and not the
drawMaze = new DrawMaze(this);
which was instantiated but never set into the content view

simple custom class extends view

i want to create a custom view class. But I get an error by run the app.
here my class:
package test.start;
import android.util.AttributeSet;
import android.view.*;
import android.graphics.*;
import android.content.Context;
public class control extends View{
private Paint paint;
public control(Context context, AttributeSet attrs, int defStyle){
super(context, attrs, defStyle);
init();
}
public void init(){
paint = new Paint();
paint.setTextSize(12);
paint.setColor(0xFF668800);
paint.setStyle(Paint.Style.FILL);
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawText("TEEEST", 100, 100, paint);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
this.setMeasuredDimension(150,200);
}
}
and the main.XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent" android:orientation="vertical">
<TextView android:id="#+id/textView1" android:text="#string/text" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
<TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:id="#+id/tableLayout1">
<Button android:id="#+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button" android:background="#drawable/custom_button" android:layout_weight="1"></Button>
<Button android:layout_width="wrap_content" android:id="#+id/button1" android:layout_height="40dip" android:text="#string/button" android:layout_weight="1"></Button>
<test.control
android:id="#+id/control"
android:layout_width="match_parent"
android:layout_height="match_parent"> </test.control>
</TableLayout>
</LinearLayout>
Error Message:
Unable to start activity
ComponentInfo{de.me.start/test.start.StartActivitiy}:
android.view.InflateException: Binary
XML file line #10: Error inflating
class test.start.control
Blockquote
But i can view the control in the graphical layout.

Try providing another version of the constructor:
public control(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}

You should declare it in the XML in the following way:
<view class="de.test.start.control"
android:id="#+id/control"
android:layout_width="match_parent"
android:layout_height="match_parent"> </view>