Automatic text switching using ViewFlipper in Sketchware


In Sketchware, to display a list of sentences one by one by automatically switching to next sentence every few seconds, follow the steps given below.

1. In Sketchware project, in main.xml add a LinearLayout linear1, with width and height as MATCH_PARENT. Set a beautiful image as background of linear1.

2. Add a CustomView customview.xml. In this add a TextView textview1, with text size 40, width and height MATCH_PARENT, and gravity center_horizontal, center_vertical.

3. Add a String List string_list.

4. In onCreate, one by one add sentences to this list.

5. After adding items to string_list, use add source directly block and put following code in it.
ViewFlipper viewFlipper = new ViewFlipper(this);

LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
layoutParams.setMargins(20, 20, 20, 20);
layoutParams.gravity = Gravity.CENTER;

viewFlipper.setLayoutParams(layoutParams);
viewFlipper.setFlipInterval(3000);
viewFlipper.setAutoStart(true);
viewFlipper.setInAnimation(this, android.R.anim.slide_in_left);
viewFlipper.setOutAnimation(this, android.R.anim.slide_out_right);
linear1.addView(viewFlipper);

The code above creates a new ViewFlipper, sets it's LayoutParams, sets it's FlipInterval, sets it's in and out animation, and adds it to linear1.

6. After this add another add source directly block and put following codes.
for (String text : string_list) {
View custom = getLayoutInflater().inflate(R.layout.customview, null);
TextView textView = custom.findViewById(R.id.textview1);
textView.setText(text);
viewFlipper.addView(custom);
}

The code above creates a View custom from CustomView customview for each String text in String list string_list. Then for each position, it gets the TextView from custom and sets it's text to the String from string_list.

7. Save and run the project. You will see the texts automatically flipping every 3000 milliseconds.

To add custom fonts to the textView, add a custom font using font manager and add set it as typeface of the TextView created in point 6 above by modifying the code as shown below.

for (String text : string_list) {
View custom = getLayoutInflater().inflate(R.layout.customview, null);
TextView textView = custom.findViewById(R.id.textview1);
textView.setTypeface(Typeface.createFromAsset(getAssets(), "fonts/cac_champagne.ttf"), 0);
textView.setText(text);
viewFlipper.addView(custom);
}

This is a simple ViewFlipper with only texts.

Comments

  1. Please Learn open text file From sd Card And Remov To Text view

    ReplyDelete
  2. Customview cannot be resolved or is not a field

    ReplyDelete
    Replies
    1. Change " Customview " with your CustomView name.

      Delete
  3. Please help, what I am looking to create what should be a simple app at this point. 50 plus buttons, each with an image, each with a sound. so far so simple. The show stopper is that I must use a custom font. first in the button text, then in any textview used. I do not need the complication of a viewFlipper. 1) How do I set the font of a button?
    2)How do I set the font of a textview?
    3)How do I put Unicode codepoints into textviews and button text?
    The button text can be fixed (no need to change programmatically) as can the textview's text.
    I think I need an Block which defines the button possition, text[I have hard coded both of these in the view screen with horizontal and vertical views.], icon, & sound.
    Then a block to show the key pressed, and play the 1-2 second sound.
    Please advise.

    ReplyDelete

Post a Comment

Popular posts from this blog

A Flash Light App in Sketchware

Create Music Player app in Sketchware

Simple car racing android game in Sketchware

In Sketchware: How to create a calculator for any simple formula?

Firebase auth in Sketchware for Login Activity