Posts tagged: android

Fit Width of Background Image But Keep Aspect Ratio in Android

So you have an image that you want to use as a background on one of your activities.

android_01

 

You probably have something that looks like this.

android_scale_01

But the desired effect is to scale the original image into the blue outline below.

android_02

The actual effect (depending on your current layout)  is the graphic anchored to the top left (android:scaleType=”fitStart”) or center (android:scaleType=”fitCenter”) of the device’s screen with no scaling performed. Through all of your research on Google (directing you mostly to Stack Overflow threads) you’re stuck with a non-scaling graphic that’s positioned incorrectly on the screen. Or maybe you’ve got a distorted graphic that has stretched both in length and width and looks terrible. The short answer?

You can not scale the width of an ImageView to the screen’s resolution while maintaining aspect ratio in an Android layout using only XML.

That’s the information I got from one of the random Stack Overflows I found. And I ignored it for quite a while before giving in and trying to scale the image manually through code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
 
        <ImageView
            android:id="@+id/iv_background"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scaleType="fitCenter"
            android:src="@drawable/the_background" />
    </LinearLayout>
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >
 
        <Button
            android:id="@+id/b_login"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="50dp"
            android:text="@string/login_button" />
    </LinearLayout>
 
</RelativeLayout>

And the necessary code placed at the bottom of the activity’s onCreate method.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int height = metrics.heightPixels;
int width = metrics.widthPixels;
 
BitmapDrawable bmap = (BitmapDrawable) this.getResources().getDrawable(R.drawable.the_background);
float bmapWidth = bmap.getBitmap().getWidth();
float bmapHeight = bmap.getBitmap().getHeight();
 
float wRatio = width / bmapWidth;
float hRatio = height / bmapHeight;
 
float ratioMultiplier = wRatio;
// Untested conditional though I expect this might work for landscape mode
if (hRatio < wRatio) {
	ratioMultiplier = hRatio;
}
 
int newBmapWidth = (int) (bmapWidth*ratioMultiplier);
int newBmapHeight = (int) (bmapHeight*ratioMultiplier);
 
ImageView iView = (ImageView) findViewById(R.id.iv_background);
iView.setLayoutParams(new LinearLayout.LayoutParams(newBmapWidth, newBmapHeight));

android_scale_02

This results in an ImageView that’s stretched to fit the width of the screen while maintaining the aspect ratio of the image.

Squishy Bugs Gameplay

I finally figured out how to record video on my computer (no audio). So here’s a session of Squishy Bugs, in case you’ve wanted to see it in action before downloading and playing this relatively small in file-size and free game.

Squishy Bugs Beta

December 24 (12 hours or so from now) you can get your hands on the Squishy Bugs beta. I’m presently testing the beta making sure all of the features are in place and that everything is working. It has been a long time in the making. 1 year ago tomorrow I released the very first version of the game. It wasn’t pretty and I probably “shot myself in the foot” by releasing the game in such an early unfinished state. If I can find some screenshots I’ll edit this post and put them below this paragraph.

Early Title Screen Early Game

Shoot forward ~365 days, now I have no problem calling the game done. You’ll get to play the beta, I’ll continue testing for a few days after the beta release, then I’ll release version 1.0 on my birthday! I turn 29 on December 29.

Squishy Bugs Tweet

That image above is the “big feature” of this next update. You can now share your high scores to Twitter and Facebook directly from within the game. I wouldn’t call coding that feature “game development” but I think it’s a necessary addition to the game. There was a lot of programming external to the actual game that was required in making Squishy Bugs.

The biggest Squishy Bugs related project being the WaggSoft api and accompanying Squishy Bugs high score list. Developing those server side features was a lot of work but the bright side is those features will be used in my future games. I don’t need to code them again. They’re done, which will speed up development of my next game(s).

So please, if you have an Android device, give Squishy Bugs a try. It’s free. It’s ad-supported. I make pennies from it per month so I’m not getting rich off this. Tell your friends. When the beta and version 1 are released please make use of the Twitter and/or Facebook sharing feature at least once.

If you have any questions you can reach me on my personal Twitter or the WaggSoft Twitter. If you’re press, (kyle at) shoot me an email (n3wt0n.com) or check out the Squishy Bugs presskit(). There are also the WaggSoft Forums.

Happy holidays to you all! Thanks for playing.

-Kyle D. Newton

The Squishy Finish Line

The end is near! There’s some quote out there that sums it up and I wish I could link to it but my Google-Fu is not with me tonight. Paraphrasing:

The goal is not to add features but to remove as many as
possible while still retaining the essence of the game.

Something like that. I cut a few features that were already implemented, and axed a couple that I was planning to add but really didn’t contribute to the game. And I added a few features that I felt did contribute to the game.

What was cut? The “group drop” power ups. That includes the “color dropper” and the “icon dropper”. What do those do, you ask? Exactly. They were confusing while playing, even to me.

Color Dropper

When you activated this power up, any time the ball hit a tile all of the similarly colored tiles adjacent to it would fall as a group.

Read more »

Squishy Bugs Alpha 7

Squishy Bugs alpha 7 has been submitted to the Google Play store.

Features

  • Now possible to score in the millions of points.
  • Every powerup now contributes to the score multiplier.
  • Added some variety to the tile icons in the “Day” theme.
  • Powerups now spawn more frequently. The chance to appear gradually increases the longer a powerup hasn’t appeared.
  • Added various informative text so the player has a better idea of why the screen appears to have paused at times.

Fixes

  • Fixed issue with music starting over again when navigating menus.
  • Fixed issue where some assets were being loaded too many times, consuming excess memory.

Staypressed theme by Themocracy