チャートエンジンを使用して円グラフを正常に表示しています。画面サイズに応じてラベルのテキストサイズをカスタマイズしたいと思います。よろしくお願いします。
7 に答える
この問題は解決に帰着します。achartengineは、生のピクセルを念頭に置いて設計されているようですが、表示品質とピクセル密度は過去2年間で劇的に向上しています。achartengineサンプルのラベルは、私のHTCOneでは小さいです。
Androidは、スケールに依存しないピクセルを導入しました。achartengineでそれらを使用するための鍵はTypedValue
クラスです。これが私がしたことです:
DisplayMetrics metrics = context.getResources().getDisplayMetrics();
float val = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 18, metrics);
上記のリンクの「テキストサイズ中」から18を取得しました。
その後、val
中サイズのテキストを使用したい場所ならどこでも使用できます。例えば:
renderer.setLabelsTextSize(val);
これは私がしたことの要約版です:
public static final int TEXT_SIZE_XHDPI = 24;
public static final int TEXT_SIZE_HDPI = 20;
public static final int TEXT_SIZE_MDPI = 18;
public static final int TEXT_SIZE_LDPI = 13;
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
switch (getResources().getDisplayMetrics().densityDpi) {
case DisplayMetrics.DENSITY_XHIGH:
renderer.setMargins(new int[] { 40, 90, 25, 10 });
renderer.setAxisTitleTextSize(Constants.TEXT_SIZE_XHDPI);
renderer.setChartTitleTextSize(Constants.TEXT_SIZE_XHDPI);
renderer.setLabelsTextSize(Constants.TEXT_SIZE_XHDPI);
renderer.setLegendTextSize(Constants.TEXT_SIZE_XHDPI);
break;
case DisplayMetrics.DENSITY_HIGH:
renderer.setMargins(new int[] { 30, 50, 20, 10 });
renderer.setAxisTitleTextSize(Constants.TEXT_SIZE_HDPI);
renderer.setChartTitleTextSize(Constants.TEXT_SIZE_HDPI);
renderer.setLabelsTextSize(Constants.TEXT_SIZE_HDPI);
renderer.setLegendTextSize(Constants.TEXT_SIZE_HDPI);
break;
default:
renderer.setMargins(new int[] { 30, 50, 20, 10 });
renderer.setAxisTitleTextSize(Constants.TEXT_SIZE_LDPI);
renderer.setChartTitleTextSize(Constants.TEXT_SIZE_LDPI);
renderer.setLabelsTextSize(Constants.TEXT_SIZE_LDPI);
renderer.setLegendTextSize(Constants.TEXT_SIZE_LDPI);
break;
}
そのため、基本的に、デバイスの画面密度に応じて、グラフの余白とテキストサイズをカスタマイズしました。注:ここでは、中密度の場合を除外しました。
dpとspの値に変換するために、_dpと_spという2つのメソッドを作成しました。
private DisplayMetrics displayMetrics;
private boolean isPortrait;
int _dp(float pixels) {
return (int)(pixels * displayMetrics.density);
}
float _sp(float pixels) {
return (pixels * displayMetrics.scaledDensity);
}
onCreateで、displayMetrics値を設定する必要があります。
displayMetrics = (this.getResources()).getDisplayMetrics();
次に、_spと_dpを使用してsp/dp値を取得します。たとえば、18にスケーリングされたフォントを設定します
renderer.setAxisTitleTextSize(_sp(18));
そして、dp値でマージンを設定するには:
renderer.setMargins(new int[] {_dp(25), _dp(30), _dp(35), _dp(20)});
注:このコードに1つの変更を加えました。これらの関数の値を0にすることは可能です。これは、戻り値で除算する場合に実際の問題になります。戻り値が1未満の場合に1を返すテストを追加しました。つまり、return((rv <1)?1:v);
ラベルのテキストサイズは次のように設定できます。
renderer.setLabelsTextSize(size);
画面サイズとラベルサイズの最適な比率を見つけるための最適なロジックを見つける必要があります。
ベストプラクティスは、ダミーのTextViewをレイアウトに配置して、textSizeを取得することです。
<TextView
android:id="@+id/dummyTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
android:text="TextView" />
そしてあなたのコードでは例えば:
TextView testTextView = (TextView) rootView.findViewById(R.id.dummyTextView);
float textSize = testTextView.getTextSize();
renderer.setLabelsTextSize(textSize);
renderer.setLegendTextSize(textSize);
私はそれを行うための最良の方法は、次のdimens.xml
ようにdpとspでファイルのサイズを定義することだと思います。
<dimen name="graph_chart_text_size">16sp</dimen>
<dimen name="graph_axis_title_text_size">14sp</dimen>
<dimen name="graph_labels_text_size">12sp</dimen>
<dimen name="graph_labels_padding">5dp</dimen>
<dimen name="graph_legend_text_size">14sp</dimen>
<dimen name="graph_legend_height">40dp</dimen>
<dimen name="graph_point">3dp</dimen>
<dimen name="graph_line">3dp</dimen>
<dimen name="graph_margin_top">10dp</dimen>
<dimen name="graph_margin_left">40dp</dimen>
<dimen name="graph_margin_right">10dp</dimen>
<dimen name="graph_margin_bottom">20dp</dimen>
次に、getDimensionとgetDimensionPixelOffsetを使用して、レンダラーを構成するときに次のようにピクセルに変換します。
renderer.setChartTitleTextSize(context.getResources().getDimension(R.dimen.graph_chart_text_size));
renderer.setAxisTitleTextSize(context.getResources().getDimension(R.dimen.graph_axis_title_text_size));
renderer.setLabelsTextSize(context.getResources().getDimension(R.dimen.graph_labels_text_size));
renderer.setLegendTextSize(context.getResources().getDimension(R.dimen.graph_legend_text_size));
renderer.setLegendHeight(context.getResources().getDimensionPixelOffset(R.dimen.graph_legend_height));
renderer.setMargins(new int[]{
context.getResources().getDimensionPixelOffset(R.dimen.graph_margin_top),
context.getResources().getDimensionPixelOffset(R.dimen.graph_margin_left_mood),
context.getResources().getDimensionPixelOffset(R.dimen.graph_margin_bottom),
context.getResources().getDimensionPixelOffset(R.dimen.graph_margin_right)});
}
私は800x480から1920x1080の範囲の電話でテストしましたが、デザインは非常に一貫しています。
あなたはこれを試すことができます:
renderer.setLegendTextSize(textSize);