在ViewPager中绘制矩形

Question

在ViewPager中动态绘制矩形的最佳方法是什么？我可以在ViewPager使用的xml中添加画布吗？如果是这样，它将如何实施？

的FragmentActivity：

public class Tabs extends FragmentActivity { 
    protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.tabs); 
    } 
} 

的FragmentPagerAdapter方法，我使用的是：

private class ScreenSlidePagerAdapter extends FragmentPagerAdapter { 
    public ScreenSlidePagerAdapter(android.support.v4.app.FragmentManager fm) { 
     super(fm); 
    } 

    @Override 
    public android.support.v4.app.Fragment getItem(int position) { 
     return ScreenSlidePageFragment.create(position); 
    } 

    @Override 
    public int getCount() { 
     return NUM_PAGES; 
    } 
} 

这是我对ViewPager

public class ScreenSlidePageFragment extends Fragment { 
/** 
* The argument key for the page number this fragment represents. 
*/ 
public static final String ARG_PAGE = "page"; 
public static TextView personalTextView, cityTextView; 

ViewGroup rootView = null; 

/** 
* The fragment's page number, which is set to the argument value for {@link #ARG_PAGE}. 
*/ 
private int mPageNumber; 
private boolean isExanded; 

/** 
* Factory method for this fragment class. Constructs a new fragment for the given page number. 
*/ 
public static Fragment create(int position) { 
    ScreenSlidePageFragment fragment = new ScreenSlidePageFragment(); 
    Bundle args = new Bundle(); 
    args.putInt(ARG_PAGE, position); 
    fragment.setArguments(args); 
    return fragment; 
} 

public ScreenSlidePageFragment() { 
} 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    mPageNumber = getArguments().getInt(ARG_PAGE); 
} 

@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
     Bundle savedInstanceState) { 
    // Inflate the layout containing a title and body text. 

    if(mPageNumber + 1==1){ 
     rootView = (ViewGroup) inflater 
       .inflate(R.layout.fragment_screen_slide_page, container, false); 


    }else if(mPageNumber + 1==2){ 
     rootView = (ViewGroup) inflater 
       .inflate(R.layout.fragment_screen_slide_page2, container, false); 

    }else if(mPageNumber + 1==3){ 
     rootView = (ViewGroup) inflater 
       .inflate(R.layout.fragment_screen_slide_page3, container, false); 

    }else if(mPageNumber + 1==4){ 
     rootView = (ViewGroup) inflater 
       .inflate(R.layout.fragment_screen_slide_page4, container, false); 

    } 


    return rootView; 
} 


/** 
* Returns the page number represented by this fragment object. 
*/ 
public int getPageNumber() { 
    return mPageNumber; 
} 

}

的片段

下面是我使用的fragment_screen_slide_page.xml：

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:mySwitch="http://schemas.android.com/apk/res-auto" 
android:id="@+id/content" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="158dp" 
    android:orientation="vertical" 
    android:padding="16dp" > 

    <!-- Need to add a rectangle here --> 
    <!-- This is the rectangle view I'm trying to draw with --> 
      <com.draw.DrawBudget 
     android:id="@+id/budget" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:gravity="center"/> 
    <TextView 
     android:id="@+id/texttop" 
     style="?android:textAppearanceLarge" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="16dp" 
     android:gravity="center_horizontal" 
     android:text="BUDGET PLANNER" 
     android:textStyle="bold" /> 

    <ImageView 
     android:id="@+id/arrow" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="right" 
     android:layout_marginRight="20dp" 
     android:layout_marginTop="10dp" 
     android:layout_toRightOf="@id/texttop" 
     android:src="@drawable/arrow" /> 

    <EditText 
     android:id="@+id/vnosEmaila" 
     android:layout_width="100dip" 
     android:layout_height="20dip" 
     android:layout_alignBottom="@+id/textView1" 
     android:layout_alignLeft="@+id/textView1" 
     android:layout_alignTop="@+id/textView1" 
     android:layout_marginLeft="99dp" 
     android:paddingBottom="0dp" 
     android:paddingTop="0dp" 
     android:text="$60.00" 
     android:textSize="12sp" /> 

    <TextView 
     android:id="@+id/textView1" 
     style="?android:textAppearanceSmall" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/arrow" 
     android:layout_toLeftOf="@+id/arrow" 
     android:lineSpacingMultiplier="1.2" 
     android:paddingTop="2dip" 
     android:text="Spending Goal" /> 

    <com.utility.less.MySwitch 
     android:id="@+id/switch2" 
     style="@style/mySwitchStyle" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:gravity="center" 
     mySwitch:textOff="ON" 
     mySwitch:textOn="OFF" 
     mySwitch:textOnThumb="false" 
     mySwitch:thumb="@drawable/switch_thumb" 
     mySwitch:track="@drawable/switch_track" /> 

    <TextView 
     android:id="@+id/days" 
     style="?android:textAppearanceSmall" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentBottom="true" 
     android:lineSpacingMultiplier="1.2" 
     android:paddingTop="2dip" 
     android:text="24 days left" /> 

</RelativeLayout> 

这里是我创建绘制一个矩形的自定义视图。它虽然没有工作。

public class DrawBudget extends View { 

Paint paint = new Paint(); 
Canvas mCanvas; 

public DrawBudget(Context context) { 
super(context); 
} 

public DrawBudget(Context context, AttributeSet attrs) { 
super(context, attrs); 
} 


@Override 
protected void onDraw(Canvas canvas) { 
    mCanvas = canvas; 
super.onDraw(canvas); 
    paint.setColor(Color.GREEN); 
    canvas.drawRect(0, 100, 100, 0, paint); 
} 
} 

Answer 1

你应该能够简单地覆盖onDraw（）并绘制你的矩形。您需要创建一个Paint对象以供在绘制期间使用，您可以在构造函数中执行该对象。

private Paint rectColor = new Paint(); 
rectColor.setColor (...); 

然后，你需要绘制矩形：

@Override 
protected void onDraw (Canvas canvas) 
{ 
    super.onDraw (canvas); 
    canvas.drawRect (..., rectColor); 
}