Как создать пользовательскую квадратичную форму в Android Studio для использования в качестве заставки для изображений?

Question

Я хотел бы сделать shape similar to this one и использовать его как изображение. Я научился делать круги и прямоугольники с помощью

canvas.drawRect(0,0,500,250,paint); 

и от того, что я просмотрел здесь я понял, что мне нужно использовать пути в illustrated in this page. Но я не знаю, с чего начать, когда я смотрю на ранее связанную страницу путей. Как создать эту пользовательскую форму, желательно, чтобы она соответствовала ширине экрана? Заранее спасибо!

Это мой код до сих пор, чтобы создать красный прямоугольник, который я в конечном итоге использовать для вставки изображения в:

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    Paint paint = new Paint(); 
    paint.setColor(Color.parseColor("#CD5C5C")); 
    Bitmap bg = Bitmap.createBitmap(480,800, Bitmap.Config.ARGB_8888); 
    Canvas canvas = new Canvas(bg); 
    canvas.drawRect(0,0,500,250,paint); 
    RelativeLayout rl = (RelativeLayout) 
    findViewById(R.id.activity_main); 
    rl.setBackgroundDrawable(new BitmapDrawable(bg)); 
} 

Answer 1

Я использовал cheesesquare демо, чтобы проверить это.

Сначала я начал с пользовательского вида для треугольника.

Обратите внимание, что вы должны добавить цвет с именем background в свои цвета.xml -или- использовать цвет, который вы настроили для фона списка.

public class TriangleView extends View { 

    private Path mPath = new Path(); 

    private Paint mPaint = new Paint(); 


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

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

    public TriangleView(Context context, AttributeSet attrs, int defStyleAttr) { 
     super(context, attrs, defStyleAttr); 
    } 

    @TargetApi(21) 
    public TriangleView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) { 
     super(context, attrs, defStyleAttr, defStyleRes); 
    } 

    @Override 
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) { 
     super.onLayout(changed, left, top, right, bottom); 

     mPath.reset(); 
     mPath.moveTo(0,0); 
     mPath.lineTo(0, getHeight()); 
     mPath.lineTo(getWidth(), getHeight()); 
     mPath.close(); 

     int backgroundColor = getResources().getColor(R.color.background); 

     mPaint.setStyle(Paint.Style.FILL); 
     mPaint.setColor(backgroundColor); 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 
     canvas.drawPath(mPath, mPaint); 
    } 
} 

Вот как я работал в макете. Треугольник покрывает нижний угол изображения. Это просто коллапсирующая панель часть макета:

 <android.support.design.widget.CollapsingToolbarLayout 
      android:id="@+id/collapsing_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed" 
      android:fitsSystemWindows="true" 
      app:contentScrim="?attr/colorPrimary" 
      app:expandedTitleMarginStart="48dp" 
      app:expandedTitleMarginEnd="64dp"> 

      <FrameLayout 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:fitsSystemWindows="true" 
       app:layout_collapseMode="none"> 

       <ImageView 
        android:id="@+id/backdrop" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:scaleType="centerCrop" /> 

       <com.example.fixme.TriangleView 
        android:layout_width="match_parent" 
        android:layout_height="48dp" 
        android:layout_gravity="bottom"/> 

      </FrameLayout> 

      <android.support.v7.widget.Toolbar 
       android:id="@+id/toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
       app:layout_collapseMode="pin" /> 

     </android.support.design.widget.CollapsingToolbarLayout> 

До тех пор, пока вы не нужен параллакс прокрутки на изображении, это, кажется, работает хорошо.