Android擬似PhotoShopパレットアプリケーション(4)異なる領域の色選択の色生成応答
7563 ワード
Android擬似PhotoShopパレットアプリケーション(4)異なる領域の色選択の色生成応答
前回は本体インタフェースの描画について述べたが、ここではパレットアプリケーションのもう一つのコア:色の選択と生成について説明する.
ColorPcikerViewの異なる部分の選択とColorPickerPanelViewの色表示はどのように応答しますか?コールバック関数はもちろん欠かせません.
ColorPickerView:
トラックボールのイベント処理を見てみましょう.
ColorPickerViewでのタッチイベントの処理:
使用時、ColorPickerDialogにColorPickerViewを実現する.OnColorChangedListenerインタフェース:
対応方法を完了します.
最後にColorPickerPanelViewクリック後の色設定イベント処理を見てみましょう.
ここでOnColorChangedListenerはColorPickerDialogで定義されています.
最終的な色はどのようにColorPickerPreferenceに表示されますか?実際には実現方法は同じです.
ColorPickerPreferenceで対応するコールバック方法を実装します.
setPreviewColor()を呼び出して、ColorPickerPreferenceの色領域の表示を変更します.
最後にgetOnPreferenceChangeListener()を呼び出す.onPreferenceChange(this, color);カラー設定値の変更
次にColorPickerDialogを開くと、上記のonColorChanged()コールバックインプリメンテーションで変更されたmValueパラメータが入力されます.
これで、PSパレットアプリケーションにおける色のインタラクションのイベントの説明が完了する.
PhotoShopのパレットの応用を分析した後、みんなは色のレンダリングの方面に対して1つの認識の上の向上があることを信じます.
前回は本体インタフェースの描画について述べたが、ここではパレットアプリケーションのもう一つのコア:色の選択と生成について説明する.
ColorPcikerViewの異なる部分の選択とColorPickerPanelViewの色表示はどのように応答しますか?コールバック関数はもちろん欠かせません.
ColorPickerView:
public interface OnColorChangedListener {
public void onColorChanged(int color);
}
トラックボールのイベント処理を見てみましょう.
@Override
public boolean onTrackballEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
boolean update = false;//
if(event.getAction() == MotionEvent.ACTION_MOVE){
switch(mLastTouchedPanel){
case PANEL_SAT_VAL:// &
float sat, val;
sat = mSat + x/50f;
val = mVal - y/50f;
if(sat < 0f){
sat = 0f;
}
else if(sat > 1f){
sat = 1f;
}
if(val < 0f){
val = 0f;
}
else if(val > 1f){
val = 1f;
}
mSat = sat;
mVal = val;
update = true;
break;
case PANEL_HUE://
float hue = mHue - y * 10f;
if(hue < 0f){
hue = 0f;
}
else if(hue > 360f){
hue = 360f;
}
mHue = hue;
update = true;
break;
case PANEL_ALPHA://
if(!mShowAlphaPanel || mAlphaRect == null){
update = false;
}
else{
int alpha = (int) (mAlpha - x*10);
if(alpha < 0){
alpha = 0;
}
else if(alpha > 0xff){
alpha = 0xff;
}
mAlpha = alpha;
update = true;
}
break;
}
}
if(update){// ,
if(mListener != null){// HSV float ARGB int
mListener.onColorChanged(Color.HSVToColor(mAlpha, new float[]{mHue, mSat, mVal}));
}
invalidate();
return true;
}
return super.onTrackballEvent(event);
}
ColorPickerViewでのタッチイベントの処理:
@Override
public boolean onTouchEvent(MotionEvent event) {
boolean update = false;
switch(event.getAction()){
case MotionEvent.ACTION_DOWN:
mStartTouchPoint = new Point((int)event.getX(), (int)event.getY());
update = moveTrackersIfNeeded(event);
break;
case MotionEvent.ACTION_MOVE:
update = moveTrackersIfNeeded(event);
break;
case MotionEvent.ACTION_UP:
mStartTouchPoint = null;
update = moveTrackersIfNeeded(event);
break;
}
if(update){
if(mListener != null){
mListener.onColorChanged(Color.HSVToColor(mAlpha, new float[]{mHue, mSat, mVal}));
}
invalidate();
return true;
}
return super.onTouchEvent(event);
}
// ,
private boolean moveTrackersIfNeeded(MotionEvent event){
if(mStartTouchPoint == null) return false;
boolean update = false;
// X,Y
int startX = mStartTouchPoint.x;
int startY = mStartTouchPoint.y;
// X,Y ,
if(mHueRect.contains(startX, startY)){
mLastTouchedPanel = PANEL_HUE;
mHue = pointToHue(event.getY());
update = true;
}
else if(mSatValRect.contains(startX, startY)){
mLastTouchedPanel = PANEL_SAT_VAL;
float[] result = pointToSatVal(event.getX(), event.getY());
mSat = result[0];
mVal = result[1];
update = true;
}
else if(mAlphaRect != null && mAlphaRect.contains(startX, startY)){
mLastTouchedPanel = PANEL_ALPHA;
mAlpha = pointToAlpha((int)event.getX());
update = true;
}
return update;
}
使用時、ColorPickerDialogにColorPickerViewを実現する.OnColorChangedListenerインタフェース:
対応方法を完了します.
@Override
public void onColorChanged(int color) {
mNewColor.setColor(color);// mNewColor ColorPickerPanelView
if (mHexValueEnabled)
updateHexValue(color);
/*
if (mListener != null) {
mListener.onColorChanged(color);
}
*/
}
private void updateHexValue(int color) {
if (getAlphaSliderVisible()) {
mHexVal.setText(ColorPickerPreference.convertToARGB(color).toUpperCase(Locale.getDefault()));
} else {
mHexVal.setText(ColorPickerPreference.convertToRGB(color).toUpperCase(Locale.getDefault()));
}
mHexVal.setTextColor(mHexDefaultTextColor);
}
/** ARGB
* For custom purposes. Not used by ColorPickerPreferrence
* @param color
* @author Unknown
*/
public static String convertToARGB(int color) {
String alpha = Integer.toHexString(Color.alpha(color));
String red = Integer.toHexString(Color.red(color));
String green = Integer.toHexString(Color.green(color));
String blue = Integer.toHexString(Color.blue(color));
if (alpha.length() == 1) {
alpha = "0" + alpha;
}
if (red.length() == 1) {
red = "0" + red;
}
if (green.length() == 1) {
green = "0" + green;
}
if (blue.length() == 1) {
blue = "0" + blue;
}
return "#" + alpha + red + green + blue;
}
最後にColorPickerPanelViewクリック後の色設定イベント処理を見てみましょう.
@Override
public void onClick(View v) {
if (v.getId() == R.id.new_color_panel) {
if (mListener != null) {
mListener.onColorChanged(mNewColor.getColor());
}
}
dismiss();
}
ここでOnColorChangedListenerはColorPickerDialogで定義されています.
private OnColorChangedListener mListener;
public interface OnColorChangedListener {
public void onColorChanged(int color);
}
最終的な色はどのようにColorPickerPreferenceに表示されますか?実際には実現方法は同じです.
implements ColorPickerDialog.OnColorChangedListener
ColorPickerPreferenceで対応するコールバック方法を実装します.
@Override
public void onColorChanged(int color) {
if (isPersistent()) {
persistInt(color);
}
mValue = color;
setPreviewColor();
try {
getOnPreferenceChangeListener().onPreferenceChange(this, color);
} catch (NullPointerException e) {
}
}
setPreviewColor()を呼び出して、ColorPickerPreferenceの色領域の表示を変更します.
private void setPreviewColor() {
if (mView == null) return;
ImageView iView = new ImageView(getContext());
LinearLayout widgetFrameView = ((LinearLayout)mView.findViewById(android.R.id.widget_frame));
if (widgetFrameView == null) return;
widgetFrameView.setVisibility(View.VISIBLE);
widgetFrameView.setPadding(
widgetFrameView.getPaddingLeft(),
widgetFrameView.getPaddingTop(),
(int)(mDensity * 8),
widgetFrameView.getPaddingBottom()
);
// remove already create preview image
int count = widgetFrameView.getChildCount();
if (count > 0) {
widgetFrameView.removeViews(0, count);
}
widgetFrameView.addView(iView);
widgetFrameView.setMinimumWidth(0);
iView.setBackgroundDrawable(new AlphaPatternDrawable((int)(5 * mDensity)));
iView.setImageBitmap(getPreviewBitmap());
}
最後にgetOnPreferenceChangeListener()を呼び出す.onPreferenceChange(this, color);カラー設定値の変更
次にColorPickerDialogを開くと、上記のonColorChanged()コールバックインプリメンテーションで変更されたmValueパラメータが入力されます.
mDialog = new ColorPickerDialog(getContext(), mValue);
これで、PSパレットアプリケーションにおける色のインタラクションのイベントの説明が完了する.
PhotoShopのパレットの応用を分析した後、みんなは色のレンダリングの方面に対して1つの認識の上の向上があることを信じます.