GUI, виджеты, пользовательский интерфейс: как мне создать иглодержатель? - PullRequest
Новая
       35

GUI, виджеты, пользовательский интерфейс: как мне создать иглодержатель?

0 голосов
/ 05 августа 2011

ОК, краткое резюме. Попросили создать приложение для работы, которое записывает данные, специфичные для данных, и отображает их на экране после завершения.Таким образом, это будет работать так. 

press start > press stop > display results.

Однако, ИТ-директор моей компании только что сказал мне, что он хочет отображать информацию в виде графиков стрелок (g-force, средняя скорость, максимальная скорость)а также хочет показывать другие яркие изображения (время, пройденное расстояние)

Моя первоначальная идея такова:

создать указатель иглы, подобный этому gauge, но в меньшем масштабеи иметь цифровое значение, отображаемое ниже или рядом с графиком, и просто отображать пройденное расстояние и время, отображаемое в виде цифр стиля будильника.Все это будет проходить вниз по левой стороне экрана в тонком столбце, а затем иметь карту с указанием начального и конечного местоположения с маршрутом, выбранным для путешествия

В основном мне бы хотелось, чтобы это выглядело такmap (извините за грубость рисунка) Что-то в этом духе было бы идеально!

Я думаю, я мог бы решить картографический бизнес и цифры для отсчетов времени и расстояния, но я никогда не делал ничегодействительно модные вещи UI.

Как бы я начал делать калибр иглы?

Я думал о том, чтобы попробовать горизонтальную линейку?В случае, если я не могу заставить работать манометр.

Кроме того, у меня только до вторника!: S

1 Ответ

1 голос
/ 05 августа 2011

предложите следующую основную идею :

У нас есть пользовательский вид с фоновым изображением, которое является мерой без иглы!

Итак, сначала мы реализуем это с помощью класса, расширяющего View

public class ourGauge extends View {

    private Bitmap bgImage = null;

    public ourGauge(Context context, Bitmap bgImage) {
        super(context);
        this.bgImage = bgImage;
    }

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

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(bgImage, 0, 0, null);
    }

}

Теперь давайте добавим иглу 

public class ourGauge extends View {

    private Bitmap bgImage = null;
    private int indicator;
    Paint paint = new Paint(); 

    public ourGauge(Context context, Bitmap bgImage) {
        super(context);
        this.bgImage = bgImage;
    }

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

    public void setIndicator(int indicator){
        this.indicator = indicator;
        invalidate();
    }

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawBitmap(bgImage, 0, 0, null);
        //you could set color based on indicator (speed or sth)
        paint.setColor(Color.BLACK); 
        canvas.drawLine(0, 0, 20, 20, paint);
        //you have to find the formula to get from where to where the line should drawn
    }

}

Чтобы было лучше

  1. Не рисуйте иглу, используя drawLine, а сделайте ее в форме с размерами
  2. Чтобы создавать динамические метки для скоростей, вы должны также нарисовать их
  3. и т.д.
...