Android enables wavy-line effects (XML bitmap) _android

Source: Internet
Author: User

The effect we want to achieve is as follows:


Before that, let's take a look at XML bitmap, what is XML bitmap?

XML Bitmap is an XML-defined file that is placed in a resource directory, where the object is a picture, an alias is defined for Bitmap, and the file can define additional attributes for Bitmap. For example: Jitter.

1, file storage location
Res/drawable/filename.xml

2. Grammar

<?xml version= "1.0" encoding= "Utf-8"?> <bitmap xmlns:android=
  "http://schemas.android.com/apk/" Res/android "
  android:src=" @[package:]drawable/drawable_resource "
  android:antialias=[" true "| "false"]
  android:dither=["true" | "false"]
  android:filter=["true" | "false"]
  android:gravity=["Top" | "Bottom" | "Left" | "Right" | "Center_vertical" |
           " Fill_vertical "| "Center_horizontal" | "Fill_horizontal" |
           " Center "| "Fill" | "Clip_vertical" | "Clip_horizontal"]
  android:tilemode=["Disabled" | "Clamp" | "Repeat" | "Mirror"]/>

Example:

<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 "Tools:context" =". Mainactivity "> <!--differs from default (@drawable/btn_default_pressed_holo_light)--> <button android:layout_ Width= "Wrap_content" android:layout_height= "Wrap_content" android:layout_centerhorizontal= "true" Android:la Yout_centervertical= "true" android:background= "@drawable/bm" android:text= "Sssssssssssssssssss"/> </Re lativelayout> <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 "Tools: Context= ". Mainactivity "> <!--differs from default (@drawable/btn_default_pressed_holo_light)--> <button Android:layout_widt H= "Wrap_content" android:layout_height= "Wrap_content "android:layout_centerhorizontal=" true "android:layout_centervertical=" true "android:background="

 @drawable/bm "android:text=" Sssssssssssssssssss "/> </RelativeLayout>

Effect Chart:

Default (@drawable/btn_default_pressed_holo_light):

Reference (\ @drawable/BM):

From the screenshot you can see the difference.

Titilemode= "Repeat":

After finding some ways to achieve the wave line, the total feeling is not satisfied, common methods to share to everyone:

1, directly to engage in a wave of such a line of Chettu

This is the simplest way, but the disadvantage is also very obvious, if the view is too wide, the picture will be distorted, as shown in the following figure:

If too small, the following:


Demand is not high, so reluctantly can muddle through, but the pursuit of perfection, this effect is obviously not to force

2. Custom Control Drawing

This method does achieve a good result, but it is troublesome to achieve. I saw a friend, too.

3, the use of XML bitmap tag to achieve the effect of the wave line

The first page is to make a wavy line of the cycle, which includes peaks and troughs, as shown in the following illustration:

Wave_item:

Then tile horizontally to achieve a wavy effect with the following code:
Wave.xml:

<?xml version= "1.0" encoding= "Utf-8"?> <bitmap xmlns:android= 
"http://schemas.android.com/apk/res/" Android " 
  android:antialias=" "True" 
  android:src= "@drawable/wave_item" 
  

Activity_main.xml

<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" 
  android:paddingbottom= "@dimen/activity_vertical_margin" 
  android: paddingtop= "@dimen/activity_vertical_margin" > 
 
  <imageview 
    android:layout_width= "Match_parent" 
    android:layout_height= "wrap_content" 
    android:background= "@drawable/wave"/> 
 
</linearlayout >

Note: This imageview through the background display picture, SRC is not to show this effect.

I hope this article will help you learn about Android software programming.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.